add: OpenGraph image, timeline card state

Added three states to timeline card, added open graph image and description

app/assets/styles/landingpage.css

@@ -26,6 +26,10 @@
 .home-text {
     padding: var(--padding-xxl) var(--padding-default);
     text-align: center;
+
+    & h3:has(+ .padding) {
+        margin-bottom: 0;
+    }
 }
 
 .timeline {

app/assets/styles/priceCard.css

@@ -2,7 +2,7 @@
     position: relative;
     width: 100%;
     color: var(--color-darkest);
-    border-bottom: 1px solid var(--color-light);
+    border-bottom: 1px dashed var(--color-light);
 
     .bottom {
         position: absolute;

app/assets/styles/timelineCard.css

@@ -6,7 +6,7 @@
     border-radius: var(--radius-default);
     padding: var(--padding-xs);
 
-    & .icon {
+    & > .icon {
         flex: 0 0 25%;
         font-size: var(--font-size-xxl);
         color: var(--color-main-dark);
@@ -16,4 +16,13 @@
         text-align: left;
         flex-grow: 1;
     }
+
+    & .state {
+        --color: var(--color-darkest);
+        display: flex;
+        align-items: center;
+        gap: var(--padding-xxs);
+        margin-top: var(--padding-s);
+        color: var(--color);
+    }
 }