Improve service cards

assets/main.css

@@ -14,7 +14,7 @@
 
 .link,
 .prose a {
-  @apply text-red-900 hover:text-red-600 dark:text-red-200 dark:hover:text-red-400 border-b-4 border-red-500/25 dark:border-red-200/25;
+  @apply text-red-900 hover:text-red-600 dark:text-red-300 dark:hover:text-red-400 border-b-4 border-red-500/25 dark:border-red-200/25;
   transition: color 200ms;
 }
 

assets/style.css

@@ -688,6 +688,10 @@ video {
   margin-top: 0.5rem;
 }
 
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
 .block {
   display: block;
 }
@@ -708,10 +712,6 @@ video {
   display: none;
 }
 
-.h-4 {
-  height: 1rem;
-}
-
 .h-6 {
   height: 1.5rem;
 }
@@ -758,6 +758,10 @@ video {
   gap: 0.5rem;
 }
 
+.gap-3 {
+  gap: 0.75rem;
+}
+
 .gap-x-6 {
   -moz-column-gap: 1.5rem;
        column-gap: 1.5rem;
@@ -767,6 +771,10 @@ video {
   row-gap: 1rem;
 }
 
+.gap-y-8 {
+  row-gap: 2rem;
+}
+
 .self-start {
   align-self: flex-start;
 }
@@ -871,10 +879,6 @@ video {
   font-weight: 500;
 }
 
-.italic {
-  font-style: italic;
-}
-
 .leading-normal {
   line-height: 1.5;
 }
@@ -927,7 +931,7 @@ video {
 .prose a {
   border-color: rgb(254 202 202 / 0.25);
   --tw-text-opacity: 1;
-  color: rgb(254 202 202 / var(--tw-text-opacity));
+  color: rgb(252 165 165 / var(--tw-text-opacity));
 }
 
 .dark .link:hover,.dark 

layouts/partials/services.html

@@ -3,16 +3,18 @@
     <li>
       <article>
         {{ .Params.iconSvg | safeHTML }}
-        {{ if isset .Params "icon" }}
-          <i class="ri-{{ .Params.icon }} block text-3xl mb-2"></i>
-        {{ end }}
-        <h4 class="inline mr-1"><a href="{{ .Params.href }}" class="font-bold link">{{ .Title }}</a></h4>
+        <div class="flex items-center gap-3 mb-2">
+          {{ if isset .Params "icon" }}
+            <i class="ri-{{ .Params.icon }} block text-3xl"></i>
+          {{ end }}
+          <h4 class="inline mr-1"><a href="{{ .Params.href }}" class="font-bold link">{{ .Title }}</a></h4>
+        </div>
         <div class="inline prose">
           {{ .Params.description | safeHTML }}
         </div>
-        <p class="mt-2">
+        {{/*  <p class="mt-2">
           <a class="link text-default font-semibold" href="{{ .RelPermalink }}">Číst více →</a>
-        </p>
+        </p>  */}}
       </article>
     </li>
   {{ end }}