diff --git a/src/styles/types.ts b/src/styles/types.ts
index 3cc059c7..fa20b285 100644
--- a/src/styles/types.ts
+++ b/src/styles/types.ts
@@ -3015,12 +3015,25 @@
           "slate": string
         }
       }
+    },
+    "serviceCard": {
+      "color": {
+        "background": {
+          "default": string,
+          "hover": string
+        },
+        "stroke": {
+          "default": string,
+          "hover": string
+        }
+      }
     }
   },
   "transition": {
     "default": string,
     "duration": {
       "slow": string,
+      "smooth": string,
       "medium": string,
       "fast": string
     },
@@ -3471,7 +3484,8 @@
     "1": string,
     "2": string,
     "3": string,
-    "4": string
+    "4": string,
+    "5": string
   },
   "breakpoint": {
     "sizes": {
diff --git a/src/styles/variables.classic.json b/src/styles/variables.classic.json
index f5ecbf28..f9c3c135 100644
--- a/src/styles/variables.classic.json
+++ b/src/styles/variables.classic.json
@@ -860,6 +860,18 @@
           "slate": "#9a9ea7"
         }
       }
+    },
+    "serviceCard": {
+      "color": {
+        "background": {
+          "default": "#FBFCFF",
+          "hover": "lch(99 1.55 272)"
+        },
+        "stroke": {
+          "default": "#e6e7e9",
+          "hover": "rgb(81% 82.1% 83.6%)"
+        }
+      }
     }
   },
   "name": "classic",
diff --git a/src/styles/variables.dark.json b/src/styles/variables.dark.json
index 92272811..265d2865 100644
--- a/src/styles/variables.dark.json
+++ b/src/styles/variables.dark.json
@@ -1617,6 +1617,18 @@
           "slate": "#9a9ea7"
         }
       }
+    },
+    "serviceCard": {
+      "color": {
+        "background": {
+          "default": "rgb(17.8% 17.8% 17.8%)",
+          "hover": "lch(19.1 0 0)"
+        },
+        "stroke": {
+          "default": "rgb(23.6% 23.6% 23.6%)",
+          "hover": "rgb(27.4% 27.4% 27.4%)"
+        }
+      }
     }
   },
   "name": "dark",
diff --git a/src/styles/variables.json b/src/styles/variables.json
index c6abfa8b..bdcd9ac3 100644
--- a/src/styles/variables.json
+++ b/src/styles/variables.json
@@ -3014,12 +3014,25 @@
           "slate": "#9a9ea7"
         }
       }
+    },
+    "serviceCard": {
+      "color": {
+        "background": {
+          "default": "#FBFCFF",
+          "hover": "lch(99 1.55 272)"
+        },
+        "stroke": {
+          "default": "#e6e7e9",
+          "hover": "rgb(81% 82.1% 83.6%)"
+        }
+      }
     }
   },
   "transition": {
     "default": "all 100ms ease-in 0ms",
     "duration": {
       "slow": "300ms",
+      "smooth": "150ms",
       "medium": "100ms",
       "fast": "50ms"
     },
@@ -3470,7 +3483,8 @@
     "1": "0 4px 6px -1px lch(6.77 0 0 / 0.15), 0 2px 4px -1px lch(6.77 0 0 / 0.15)",
     "2": "0 4px 4px 0 rgba(88, 92, 98, 0.06), inset 5px 0 10px 0 rgba(104, 105, 111, 0.1)",
     "3": "-5px 0 20px 0 rgba(0, 0, 0, 0.08), -6px 0 10px 0 rgba(0, 0, 0, 0.08)",
-    "4": "5px 0 20px 0 rgba(0, 0, 0, 0.08), 6px 0 10px 0 rgba(0, 0, 0, 0.08)"
+    "4": "5px 0 20px 0 rgba(0, 0, 0, 0.08), 6px 0 10px 0 rgba(0, 0, 0, 0.08)",
+    "5": "0 2px 2px 0 rgba(0, 0, 0, 0.03)"
   },
   "breakpoint": {
     "sizes": {
diff --git a/src/styles/variables.light.json b/src/styles/variables.light.json
index b250896e..c9b95ac5 100644
--- a/src/styles/variables.light.json
+++ b/src/styles/variables.light.json
@@ -1604,6 +1604,18 @@
           "slate": "#9a9ea7"
         }
       }
+    },
+    "serviceCard": {
+      "color": {
+        "background": {
+          "default": "#FBFCFF",
+          "hover": "lch(99 1.55 272)"
+        },
+        "stroke": {
+          "default": "#e6e7e9",
+          "hover": "rgb(81% 82.1% 83.6%)"
+        }
+      }
     }
   },
   "name": "light",