hds-web 1.0.0 → 1.0.2

package/src/styles/tailwind.css

@@ -863,6 +863,10 @@ select {
   bottom: 0.375rem;
 }
 
+.bottom-8 {
+  bottom: 2rem;
+}
+
 .bottom-full {
   bottom: 100%;
 }
@@ -875,26 +879,10 @@ select {
   left: 50%;
 }
 
-.left-10 {
-  left: 2.5rem;
-}
-
-.left-16 {
-  left: 4rem;
-}
-
 .left-2 {
   left: 0.5rem;
 }
 
-.left-4 {
-  left: 1rem;
-}
-
-.left-8 {
-  left: 2rem;
-}
-
 .left-\[160\%\] {
   left: 160%;
 }
@@ -919,24 +907,12 @@ select {
   right: 0.5rem;
 }
 
-.top-0 {
-  top: 0px;
-}
-
-.top-10 {
-  top: 2.5rem;
-}
-
-.top-16 {
-  top: 4rem;
+.right-8 {
+  right: 2rem;
 }
 
-.top-4 {
-  top: 1rem;
-}
-
-.top-8 {
-  top: 2rem;
+.top-0 {
+  top: 0px;
 }
 
 .isolate {
@@ -951,18 +927,14 @@ select {
   z-index: 10;
 }
 
-.z-20 {
-  z-index: 20;
-}
-
-.z-30 {
-  z-index: 30;
-}
-
 .z-50 {
   z-index: 50;
 }
 
+.z-\[1\] {
+  z-index: 1;
+}
+
 .z-\[2\] {
   z-index: 2;
 }
@@ -991,6 +963,10 @@ select {
   margin: -0.75rem;
 }
 
+.m-2 {
+  margin: 0.5rem;
+}
+
 .m-4 {
   margin: 1rem;
 }
@@ -1010,11 +986,6 @@ select {
   margin-bottom: -0.5rem;
 }
 
-.-my-6 {
-  margin-top: -1.5rem;
-  margin-bottom: -1.5rem;
-}
-
 .mx-10 {
   margin-left: 2.5rem;
   margin-right: 2.5rem;
@@ -1130,10 +1101,6 @@ select {
   margin-right: -0.5rem;
 }
 
-.-mt-4 {
-  margin-top: -1rem;
-}
-
 .-mt-5 {
   margin-top: -1.25rem;
 }
@@ -1142,6 +1109,14 @@ select {
   margin-top: -1.5rem;
 }
 
+.mb-1 {
+  margin-bottom: 0.25rem;
+}
+
+.mb-10 {
+  margin-bottom: 2.5rem;
+}
+
 .mb-2 {
   margin-bottom: 0.5rem;
 }
@@ -1154,6 +1129,14 @@ select {
   margin-bottom: 1rem;
 }
 
+.mb-6 {
+  margin-bottom: 1.5rem;
+}
+
+.mb-9 {
+  margin-bottom: 2.25rem;
+}
+
 .mb-\[28\%\] {
   margin-bottom: 28%;
 }
@@ -1174,6 +1157,10 @@ select {
   margin-left: 0.5rem;
 }
 
+.ml-20 {
+  margin-left: 5rem;
+}
+
 .ml-3 {
   margin-left: 0.75rem;
 }
@@ -1206,6 +1193,10 @@ select {
   margin-top: 2.5rem;
 }
 
+.mt-16 {
+  margin-top: 4rem;
+}
+
 .mt-2 {
   margin-top: 0.5rem;
 }
@@ -1278,6 +1269,10 @@ select {
   height: 0.25rem;
 }
 
+.h-1\/2 {
+  height: 50%;
+}
+
 .h-10 {
   height: 2.5rem;
 }
@@ -1302,6 +1297,10 @@ select {
   height: 6rem;
 }
 
+.h-3 {
+  height: 0.75rem;
+}
+
 .h-4 {
   height: 1rem;
 }
@@ -1314,18 +1313,10 @@ select {
   height: 1.25rem;
 }
 
-.h-52 {
-  height: 13rem;
-}
-
 .h-6 {
   height: 1.5rem;
 }
 
-.h-64 {
-  height: 16rem;
-}
-
 .h-7 {
   height: 1.75rem;
 }
@@ -1338,6 +1329,10 @@ select {
   height: 2.25rem;
 }
 
+.h-\[130px\] {
+  height: 130px;
+}
+
 .h-\[60px\] {
   height: 60px;
 }
@@ -1346,6 +1341,10 @@ select {
   height: 100%;
 }
 
+.max-h-\[26\.25\] {
+  max-height: 26.25;
+}
+
 .w-1\/2 {
   width: 50%;
 }
@@ -1378,6 +1377,10 @@ select {
   width: 6rem;
 }
 
+.w-3 {
+  width: 0.75rem;
+}
+
 .w-3\/4 {
   width: 75%;
 }
@@ -1406,6 +1409,14 @@ select {
   width: 24rem;
 }
 
+.w-\[220px\] {
+  width: 220px;
+}
+
+.w-\[290px\] {
+  width: 290px;
+}
+
 .w-\[60\%\] {
   width: 60%;
 }
@@ -1448,10 +1459,28 @@ select {
   width: 100vw;
 }
 
+.min-w-\[15rem\] {
+  min-width: 15rem;
+}
+
+.min-w-\[882px\] {
+  min-width: 882px;
+}
+
+.min-w-fit {
+  min-width: -webkit-fit-content;
+  min-width: -moz-fit-content;
+  min-width: fit-content;
+}
+
 .min-w-full {
   min-width: 100%;
 }
 
+.min-w-\[18rem\] {
+  min-width: 18rem;
+}
+
 .max-w-2xl {
   max-width: 42rem;
 }
@@ -1460,6 +1489,14 @@ select {
   max-width: 80rem;
 }
 
+.max-w-\[15rem\] {
+  max-width: 15rem;
+}
+
+.max-w-\[18rem\] {
+  max-width: 18rem;
+}
+
 .max-w-\[6rem\] {
   max-width: 6rem;
 }
@@ -1473,6 +1510,11 @@ select {
   max-width: 28rem;
 }
 
+.max-w-min {
+  max-width: -webkit-min-content;
+  max-width: min-content;
+}
+
 .max-w-xs {
   max-width: 20rem;
 }
@@ -1534,6 +1576,12 @@ select {
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.translate-y-\[-20px\] {
+  --tw-translate-y: -20px;
+  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .rotate-45 {
   --tw-rotate: 45deg;
   -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1559,6 +1607,47 @@ select {
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+@-webkit-keyframes bounce {
+  0%, 100% {
+    -webkit-transform: translateY(-25%);
+            transform: translateY(-25%);
+    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
+            animation-timing-function: cubic-bezier(0.8,0,1,1);
+  }
+
+  50% {
+    -webkit-transform: none;
+            transform: none;
+    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
+            animation-timing-function: cubic-bezier(0,0,0.2,1);
+  }
+}
+
+@keyframes bounce {
+  0%, 100% {
+    -webkit-transform: translateY(-25%);
+            transform: translateY(-25%);
+    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
+            animation-timing-function: cubic-bezier(0.8,0,1,1);
+  }
+
+  50% {
+    -webkit-transform: none;
+            transform: none;
+    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
+            animation-timing-function: cubic-bezier(0,0,0.2,1);
+  }
+}
+
+.animate-bounce {
+  -webkit-animation: bounce 1s infinite;
+          animation: bounce 1s infinite;
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
 .select-none {
   -webkit-user-select: none;
           user-select: none;
@@ -1628,6 +1717,10 @@ select {
   align-items: flex-start;
 }
 
+.items-end {
+  align-items: flex-end;
+}
+
 .items-center {
   align-items: center;
 }
@@ -1680,14 +1773,26 @@ select {
   gap: 1rem;
 }
 
+.gap-5 {
+  gap: 1.25rem;
+}
+
 .gap-6 {
   gap: 1.5rem;
 }
 
+.gap-8 {
+  gap: 2rem;
+}
+
 .gap-\[14rem\] {
   gap: 14rem;
 }
 
+.gap-\[25rem\] {
+  gap: 25rem;
+}
+
 .gap-x-1 {
   -webkit-column-gap: 0.25rem;
           column-gap: 0.25rem;
@@ -1805,10 +1910,13 @@ select {
   border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
 }
 
-.divide-y-2 > :not([hidden]) ~ :not([hidden]) {
-  --tw-divide-y-reverse: 0;
-  border-top-width: calc(2px * calc(1 - var(--tw-divide-y-reverse)));
-  border-bottom-width: calc(2px * var(--tw-divide-y-reverse));
+.divide-blue-600\/10 > :not([hidden]) ~ :not([hidden]) {
+  border-color: rgb(30 86 227 / 0.1);
+}
+
+.divide-neutral-150 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-opacity: 1;
+  border-color: rgb(236 237 240 / var(--tw-divide-opacity));
 }
 
 .overflow-auto {
@@ -1847,6 +1955,10 @@ select {
   white-space: pre-wrap;
 }
 
+.break-words {
+  overflow-wrap: break-word;
+}
+
 .rounded {
   border-radius: 0.25rem;
 }
@@ -1888,6 +2000,16 @@ select {
   border-bottom-left-radius: 1rem;
 }
 
+.rounded-b-3xl {
+  border-bottom-right-radius: 1.5rem;
+  border-bottom-left-radius: 1.5rem;
+}
+
+.rounded-l-3xl {
+  border-top-left-radius: 1.5rem;
+  border-bottom-left-radius: 1.5rem;
+}
+
 .rounded-l-md {
   border-top-left-radius: 0.375rem;
   border-bottom-left-radius: 0.375rem;
@@ -1944,10 +2066,18 @@ select {
   border-left-width: 2px;
 }
 
+.border-r {
+  border-right-width: 1px;
+}
+
 .border-r-0 {
   border-right-width: 0px;
 }
 
+.border-t {
+  border-top-width: 1px;
+}
+
 .border-solid {
   border-style: solid;
 }
@@ -2012,6 +2142,11 @@ select {
   border-color: rgb(243 244 246 / var(--tw-border-opacity));
 }
 
+.border-neutral-150 {
+  --tw-border-opacity: 1;
+  border-color: rgb(236 237 240 / var(--tw-border-opacity));
+}
+
 .border-neutral-200 {
   --tw-border-opacity: 1;
   border-color: rgb(229 231 235 / var(--tw-border-opacity));
@@ -2037,14 +2172,24 @@ select {
   border-color: rgb(225 58 124 / var(--tw-border-opacity));
 }
 
+.border-b-neutral-150 {
+  --tw-border-opacity: 1;
+  border-bottom-color: rgb(236 237 240 / var(--tw-border-opacity));
+}
+
 .border-b-neutral-400 {
   --tw-border-opacity: 1;
   border-bottom-color: rgb(157 164 174 / var(--tw-border-opacity));
 }
 
-.bg-\[\#333333\] {
-  --tw-bg-opacity: 1;
-  background-color: rgb(51 51 51 / var(--tw-bg-opacity));
+.border-r-neutral-150 {
+  --tw-border-opacity: 1;
+  border-right-color: rgb(236 237 240 / var(--tw-border-opacity));
+}
+
+.border-t-neutral-150 {
+  --tw-border-opacity: 1;
+  border-top-color: rgb(236 237 240 / var(--tw-border-opacity));
 }
 
 .bg-amber-100 {
@@ -2527,6 +2672,10 @@ select {
   background-color: rgb(133 77 24 / var(--tw-bg-opacity));
 }
 
+.bg-gradient-to-b {
+  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
+}
+
 .from-amber-100 {
   --tw-gradient-from: #FFF3D4 var(--tw-gradient-from-position);
   --tw-gradient-from-position:  ;
@@ -4447,177 +4596,568 @@ select {
   --tw-gradient-to-position:  ;
 }
 
-.stroke-pink-500 {
-  stroke: #E13A7C;
+.stroke-blue-400 {
+  stroke: #80A3FF;
 }
 
-.stroke-pink-600 {
-  stroke: #C21E5F;
+.stroke-green-600 {
+  stroke: #027D59;
 }
 
-.stroke-2 {
-  stroke-width: 2;
+.stroke-neutral-800 {
+  stroke: #1F2A37;
 }
 
-.object-contain {
-  object-fit: contain;
+.stroke-blue-600 {
+  stroke: #1E56E3;
 }
 
-.object-cover {
-  object-fit: cover;
+.stroke-amber-100 {
+  stroke: #FFF3D4;
 }
 
-.p-0 {
-  padding: 0px;
+.stroke-amber-200 {
+  stroke: #FFE4B0;
 }
 
-.p-1 {
-  padding: 0.25rem;
+.stroke-amber-300 {
+  stroke: #FFCE70;
 }
 
-.p-1\.5 {
-  padding: 0.375rem;
+.stroke-amber-400 {
+  stroke: #FFA81B;
 }
 
-.p-2 {
-  padding: 0.5rem;
+.stroke-amber-500 {
+  stroke: #E07900;
 }
 
-.p-2\.5 {
-  padding: 0.625rem;
+.stroke-amber-600 {
+  stroke: #B85800;
 }
 
-.p-3 {
-  padding: 0.75rem;
+.stroke-amber-700 {
+  stroke: #993700;
 }
 
-.p-4 {
-  padding: 1rem;
+.stroke-amber-800 {
+  stroke: #782400;
 }
 
-.p-5 {
-  padding: 1.25rem;
+.stroke-amber-900 {
+  stroke: #471500;
 }
 
-.p-6 {
-  padding: 1.5rem;
+.stroke-base-0 {
+  stroke: #FFFFFF;
 }
 
-.p-8 {
-  padding: 2rem;
+.stroke-base-1000 {
+  stroke: #000615;
 }
 
-.p-\[0px_8px_0px_0px\;\] {
-  padding: 0px 8px 0px 0px;;
+.stroke-blue-100 {
+  stroke: #F0F4FF;
 }
 
-.px-0 {
-  padding-left: 0px;
-  padding-right: 0px;
+.stroke-blue-200 {
+  stroke: #DFE8FF;
 }
 
-.px-0\.5 {
-  padding-left: 0.125rem;
-  padding-right: 0.125rem;
+.stroke-blue-300 {
+  stroke: #C6D6FF;
 }
 
-.px-1 {
-  padding-left: 0.25rem;
-  padding-right: 0.25rem;
+.stroke-blue-500 {
+  stroke: #3970FD;
 }
 
-.px-1\.5 {
-  padding-left: 0.375rem;
-  padding-right: 0.375rem;
+.stroke-blue-700 {
+  stroke: #0D41C6;
 }
 
-.px-2 {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
+.stroke-blue-800 {
+  stroke: #00288E;
 }
 
-.px-2\.5 {
-  padding-left: 0.625rem;
-  padding-right: 0.625rem;
+.stroke-blue-900 {
+  stroke: #001C63;
 }
 
-.px-3 {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
+.stroke-cyan-100 {
+  stroke: #E3FAFF;
 }
 
-.px-3\.5 {
-  padding-left: 0.875rem;
-  padding-right: 0.875rem;
+.stroke-cyan-200 {
+  stroke: #C2F4FF;
 }
 
-.px-4 {
-  padding-left: 1rem;
-  padding-right: 1rem;
+.stroke-cyan-300 {
+  stroke: #93ECFF;
 }
 
-.px-5 {
-  padding-left: 1.25rem;
-  padding-right: 1.25rem;
+.stroke-cyan-400 {
+  stroke: #3ECAE8;
 }
 
-.px-6 {
-  padding-left: 1.5rem;
-  padding-right: 1.5rem;
+.stroke-cyan-500 {
+  stroke: #0E96B2;
 }
 
-.py-0 {
-  padding-top: 0px;
-  padding-bottom: 0px;
+.stroke-cyan-600 {
+  stroke: #04758D;
 }
 
-.py-0\.5 {
-  padding-top: 0.125rem;
-  padding-bottom: 0.125rem;
+.stroke-cyan-700 {
+  stroke: #005A6C;
 }
 
-.py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+.stroke-cyan-800 {
+  stroke: #003945;
 }
 
-.py-1\.5 {
-  padding-top: 0.375rem;
-  padding-bottom: 0.375rem;
+.stroke-cyan-900 {
+  stroke: #00232B;
 }
 
-.py-10 {
-  padding-top: 2.5rem;
-  padding-bottom: 2.5rem;
+.stroke-green-100 {
+  stroke: #DAFFF4;
 }
 
-.py-2 {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+.stroke-green-200 {
+  stroke: #B8FBE7;
 }
 
-.py-2\.5 {
-  padding-top: 0.625rem;
-  padding-bottom: 0.625rem;
+.stroke-green-300 {
+  stroke: #91F5D7;
 }
 
-.py-3 {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
+.stroke-green-400 {
+  stroke: #39DAAA;
 }
 
-.py-3\.5 {
-  padding-top: 0.875rem;
-  padding-bottom: 0.875rem;
+.stroke-green-500 {
+  stroke: #0EA578;
 }
 
-.py-4 {
-  padding-top: 1rem;
-  padding-bottom: 1rem;
+.stroke-green-700 {
+  stroke: #006043;
 }
 
-.py-5 {
-  padding-top: 1.25rem;
+.stroke-green-800 {
+  stroke: #003C2B;
+}
+
+.stroke-green-900 {
+  stroke: #00281D;
+}
+
+.stroke-neutral-0 {
+  stroke: #FFFFFF;
+}
+
+.stroke-neutral-100 {
+  stroke: #F3F4F6;
+}
+
+.stroke-neutral-1000 {
+  stroke: #000615;
+}
+
+.stroke-neutral-150 {
+  stroke: #ECEDF0;
+}
+
+.stroke-neutral-200 {
+  stroke: #E5E7EB;
+}
+
+.stroke-neutral-300 {
+  stroke: #D2D6DB;
+}
+
+.stroke-neutral-400 {
+  stroke: #9DA4AE;
+}
+
+.stroke-neutral-50 {
+  stroke: #F9FAFB;
+}
+
+.stroke-neutral-500 {
+  stroke: #6C737F;
+}
+
+.stroke-neutral-600 {
+  stroke: #4D5761;
+}
+
+.stroke-neutral-700 {
+  stroke: #384250;
+}
+
+.stroke-neutral-850 {
+  stroke: #18222F;
+}
+
+.stroke-neutral-900 {
+  stroke: #111927;
+}
+
+.stroke-neutral-950 {
+  stroke: #0D1420;
+}
+
+.stroke-orange-100 {
+  stroke: #FFEDD7;
+}
+
+.stroke-orange-200 {
+  stroke: #FED7AD;
+}
+
+.stroke-orange-300 {
+  stroke: #FDB97A;
+}
+
+.stroke-orange-400 {
+  stroke: #FB9147;
+}
+
+.stroke-orange-500 {
+  stroke: #F87229;
+}
+
+.stroke-orange-600 {
+  stroke: #E9571F;
+}
+
+.stroke-orange-700 {
+  stroke: #C14018;
+}
+
+.stroke-orange-800 {
+  stroke: #993418;
+}
+
+.stroke-pink-100 {
+  stroke: #FFEDF4;
+}
+
+.stroke-pink-200 {
+  stroke: #FFD9E7;
+}
+
+.stroke-pink-300 {
+  stroke: #FFBCD6;
+}
+
+.stroke-pink-400 {
+  stroke: #F677AA;
+}
+
+.stroke-pink-500 {
+  stroke: #E13A7C;
+}
+
+.stroke-pink-600 {
+  stroke: #C21E5F;
+}
+
+.stroke-pink-700 {
+  stroke: #A50A48;
+}
+
+.stroke-pink-800 {
+  stroke: #71002C;
+}
+
+.stroke-pink-900 {
+  stroke: #49001D;
+}
+
+.stroke-purple-100 {
+  stroke: #F7F2FF;
+}
+
+.stroke-purple-200 {
+  stroke: #EDE1FF;
+}
+
+.stroke-purple-300 {
+  stroke: #DBC6FF;
+}
+
+.stroke-purple-400 {
+  stroke: #B487FF;
+}
+
+.stroke-purple-500 {
+  stroke: #8C49FA;
+}
+
+.stroke-purple-600 {
+  stroke: #712BE3;
+}
+
+.stroke-purple-700 {
+  stroke: #5E13D7;
+}
+
+.stroke-purple-800 {
+  stroke: #3F01A6;
+}
+
+.stroke-purple-900 {
+  stroke: #29006B;
+}
+
+.stroke-red-100 {
+  stroke: #FEE2E2;
+}
+
+.stroke-red-200 {
+  stroke: #FECACB;
+}
+
+.stroke-red-300 {
+  stroke: #FBA5A6;
+}
+
+.stroke-red-400 {
+  stroke: #F77173;
+}
+
+.stroke-red-500 {
+  stroke: #EE4447;
+}
+
+.stroke-red-600 {
+  stroke: #DB252B;
+}
+
+.stroke-red-700 {
+  stroke: #B81B20;
+}
+
+.stroke-red-800 {
+  stroke: #981A1E;
+}
+
+.stroke-yellow-100 {
+  stroke: #FFF9C7;
+}
+
+.stroke-yellow-200 {
+  stroke: #FFEF93;
+}
+
+.stroke-yellow-300 {
+  stroke: #FFDF5A;
+}
+
+.stroke-yellow-400 {
+  stroke: #FBCB3A;
+}
+
+.stroke-yellow-500 {
+  stroke: #EBB230;
+}
+
+.stroke-yellow-600 {
+  stroke: #CA8924;
+}
+
+.stroke-yellow-700 {
+  stroke: #A1611A;
+}
+
+.stroke-yellow-800 {
+  stroke: #854D18;
+}
+
+.stroke-2 {
+  stroke-width: 2;
+}
+
+.stroke-\[1\.5px\] {
+  stroke-width: 1.5px;
+}
+
+.object-contain {
+  object-fit: contain;
+}
+
+.object-cover {
+  object-fit: cover;
+}
+
+.p-0 {
+  padding: 0px;
+}
+
+.p-1 {
+  padding: 0.25rem;
+}
+
+.p-1\.5 {
+  padding: 0.375rem;
+}
+
+.p-2 {
+  padding: 0.5rem;
+}
+
+.p-2\.5 {
+  padding: 0.625rem;
+}
+
+.p-3 {
+  padding: 0.75rem;
+}
+
+.p-4 {
+  padding: 1rem;
+}
+
+.p-5 {
+  padding: 1.25rem;
+}
+
+.p-6 {
+  padding: 1.5rem;
+}
+
+.p-8 {
+  padding: 2rem;
+}
+
+.p-\[0px_8px_0px_0px\;\] {
+  padding: 0px 8px 0px 0px;;
+}
+
+.px-0 {
+  padding-left: 0px;
+  padding-right: 0px;
+}
+
+.px-0\.5 {
+  padding-left: 0.125rem;
+  padding-right: 0.125rem;
+}
+
+.px-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
+.px-1\.5 {
+  padding-left: 0.375rem;
+  padding-right: 0.375rem;
+}
+
+.px-2 {
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+
+.px-2\.5 {
+  padding-left: 0.625rem;
+  padding-right: 0.625rem;
+}
+
+.px-20 {
+  padding-left: 5rem;
+  padding-right: 5rem;
+}
+
+.px-3 {
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
+.px-3\.5 {
+  padding-left: 0.875rem;
+  padding-right: 0.875rem;
+}
+
+.px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+.px-5 {
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
+}
+
+.px-6 {
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
+
+.px-8 {
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
+
+.py-0 {
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+.py-0\.5 {
+  padding-top: 0.125rem;
+  padding-bottom: 0.125rem;
+}
+
+.py-1 {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+.py-1\.5 {
+  padding-top: 0.375rem;
+  padding-bottom: 0.375rem;
+}
+
+.py-10 {
+  padding-top: 2.5rem;
+  padding-bottom: 2.5rem;
+}
+
+.py-2 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.py-2\.5 {
+  padding-top: 0.625rem;
+  padding-bottom: 0.625rem;
+}
+
+.py-20 {
+  padding-top: 5rem;
+  padding-bottom: 5rem;
+}
+
+.py-3 {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+}
+
+.py-3\.5 {
+  padding-top: 0.875rem;
+  padding-bottom: 0.875rem;
+}
+
+.py-4 {
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
+.py-5 {
+  padding-top: 1.25rem;
   padding-bottom: 1.25rem;
 }
 
@@ -4626,10 +5166,34 @@ select {
   padding-bottom: 1.5rem;
 }
 
+.pb-10 {
+  padding-bottom: 2.5rem;
+}
+
+.pb-16 {
+  padding-bottom: 4rem;
+}
+
+.pb-2 {
+  padding-bottom: 0.5rem;
+}
+
+.pb-20 {
+  padding-bottom: 5rem;
+}
+
+.pb-4 {
+  padding-bottom: 1rem;
+}
+
 .pb-6 {
   padding-bottom: 1.5rem;
 }
 
+.pb-8 {
+  padding-bottom: 2rem;
+}
+
 .pl-1 {
   padding-left: 0.25rem;
 }
@@ -4690,6 +5254,14 @@ select {
   padding-right: 1rem;
 }
 
+.pr-48 {
+  padding-right: 12rem;
+}
+
+.pr-6 {
+  padding-right: 1.5rem;
+}
+
 .pr-7 {
   padding-right: 1.75rem;
 }
@@ -4698,6 +5270,14 @@ select {
   padding-right: 10px;
 }
 
+.pt-0 {
+  padding-top: 0px;
+}
+
+.pt-10 {
+  padding-top: 2.5rem;
+}
+
 .pt-16 {
   padding-top: 4rem;
 }
@@ -4706,6 +5286,22 @@ select {
   padding-top: 1.25rem;
 }
 
+.pt-6 {
+  padding-top: 1.5rem;
+}
+
+.pt-\[2\.875rem\] {
+  padding-top: 2.875rem;
+}
+
+.pb-14 {
+  padding-bottom: 3.5rem;
+}
+
+.pt-4 {
+  padding-top: 1rem;
+}
+
 .text-left {
   text-align: left;
 }
@@ -4714,6 +5310,10 @@ select {
   text-align: center;
 }
 
+.text-right {
+  text-align: right;
+}
+
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -4731,6 +5331,13 @@ select {
   font-weight: 500;
 }
 
+.text-hds-d-body3c {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  letter-spacing: ;
+  font-weight: 400;
+}
+
 .text-hds-d-body3c-medium {
   font-size: 0.875rem;
   line-height: 1.25rem;
@@ -5002,10 +5609,22 @@ select {
   font-weight: 500;
 }
 
+.font-normal {
+  font-weight: 400;
+}
+
 .font-semibold {
   font-weight: 600;
 }
 
+.uppercase {
+  text-transform: uppercase;
+}
+
+.capitalize {
+  text-transform: capitalize;
+}
+
 .italic {
   font-style: italic;
 }
@@ -5692,12 +6311,398 @@ select {
   transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 
-.ease-out {
-  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+.ease-out {
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
+
+/* Typography classes */
+
+.card-animation-wrapper {
+  position: relative;
+}
+
+.card-animation-wrapper .feature-card {
+  transition: all;
+}
+
+.card-animation-wrapper .feature-card:first-child {
+  -webkit-animation: card1 15s infinite;
+          animation: card1 15s infinite;
+}
+
+.card-animation-wrapper .feature-card:nth-child(2) {
+  -webkit-animation: card2 15s infinite;
+          animation: card2 15s infinite;
+}
+
+.card-animation-wrapper .feature-card:nth-child(3) {
+  -webkit-animation: card3 15s infinite;
+          animation: card3 15s infinite;
+}
+
+@-webkit-keyframes card1 {
+  0%   {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+    z-index: 3;
+  }
+
+  0.1%,6.65%   {
+    z-index: 3;
+  }
+
+  6.66%, 26.64%  {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+
+  33.3%, 59.94%  {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+
+  66.6%, 100% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+    z-index: 0;
+  }
+}
+
+@keyframes card1 {
+  0%   {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+    z-index: 3;
+  }
+
+  0.1%,6.65%   {
+    z-index: 3;
+  }
+
+  6.66%, 26.64%  {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+
+  33.3%, 59.94%  {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+
+  66.6%, 100% {
+    -webkit-transform: translate(0, 0);
+            transform: translate(0, 0);
+    z-index: 0;
+  }
+}
+
+@media (max-width: 600px) {
+  @-webkit-keyframes card1 {
+    0%   {
+      -webkit-transform: translate(0, 0);
+              transform: translate(0, 0);
+      z-index: 3;
+    }
+
+    0.1%,6.65%   {
+      z-index: 3;
+    }
+
+    6.66%, 26.64%  {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+
+    33.3%, 59.94%  {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+
+    66.6%, 100% {
+      -webkit-transform: translate(0, 0);
+              transform: translate(0, 0);
+      z-index: 0;
+    }
+  }
+  @keyframes card1 {
+    0%   {
+      -webkit-transform: translate(0, 0);
+              transform: translate(0, 0);
+      z-index: 3;
+    }
+
+    0.1%,6.65%   {
+      z-index: 3;
+    }
+
+    6.66%, 26.64%  {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+
+    33.3%, 59.94%  {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+
+    66.6%, 100% {
+      -webkit-transform: translate(0, 0);
+              transform: translate(0, 0);
+      z-index: 0;
+    }
+  }
+}
+
+@-webkit-keyframes card2 {
+  0%   {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+
+  6.66%, 26.64%  {
+    -webkit-transform: translate(0px, 0px);
+            transform: translate(0px, 0px);
+    z-index: 0;
+  }
+
+  26.65%,33.29%   {
+    z-index: 2;
+  }
+
+  33.3%, 59.94%  {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+
+  66.6%, 100% {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+}
+
+@keyframes card2 {
+  0%   {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+
+  6.66%, 26.64%  {
+    -webkit-transform: translate(0px, 0px);
+            transform: translate(0px, 0px);
+    z-index: 0;
+  }
+
+  26.65%,33.29%   {
+    z-index: 2;
+  }
+
+  33.3%, 59.94%  {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+
+  66.6%, 100% {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+}
+
+@media (max-width: 600px) {
+  @-webkit-keyframes card2 {
+    0%   {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+
+    6.66%, 26.64%  {
+      -webkit-transform: translate(0px, 0px);
+              transform: translate(0px, 0px);
+      z-index: 0;
+    }
+
+    26.65%,33.29%   {
+      z-index: 2;
+    }
+
+    33.3%, 59.94%  {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+
+    66.6%, 100% {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+  }
+  @keyframes card2 {
+    0%   {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+
+    6.66%, 26.64%  {
+      -webkit-transform: translate(0px, 0px);
+              transform: translate(0px, 0px);
+      z-index: 0;
+    }
+
+    26.65%,33.29%   {
+      z-index: 2;
+    }
+
+    33.3%, 59.94%  {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+
+    66.6%, 100% {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+  }
+}
+
+@-webkit-keyframes card3 {
+  0%   {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+
+  6.66%, 26.64%  {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+
+  33.3%, 59.94%  {
+    -webkit-transform: translate(0px, 0px);
+            transform: translate(0px, 0px);
+    z-index: 0;
+  }
+
+  59.95%,66.5%   {
+    z-index: 2;
+  }
+
+  66.6%, 100% {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+}
+
+@keyframes card3 {
+  0%   {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+
+  6.66%, 26.64%  {
+    -webkit-transform: translate(2rem, 2rem);
+            transform: translate(2rem, 2rem);
+    z-index: 1;
+  }
+
+  33.3%, 59.94%  {
+    -webkit-transform: translate(0px, 0px);
+            transform: translate(0px, 0px);
+    z-index: 0;
+  }
+
+  59.95%,66.5%   {
+    z-index: 2;
+  }
+
+  66.6%, 100% {
+    -webkit-transform: translate(4rem, 4rem);
+            transform: translate(4rem, 4rem);
+    z-index: 2;
+  }
+}
+
+@media (max-width: 600px) {
+  @-webkit-keyframes card3 {
+    0%   {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+
+    6.66%, 26.64%  {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+
+    33.3%, 59.94%  {
+      -webkit-transform: translate(0px, 0px);
+              transform: translate(0px, 0px);
+      z-index: 0;
+    }
+
+    59.95%,66.5%   {
+      z-index: 2;
+    }
+
+    66.6%, 100% {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+  }
+  @keyframes card3 {
+    0%   {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+
+    6.66%, 26.64%  {
+      -webkit-transform: translate(1.5rem, 1.5rem);
+              transform: translate(1.5rem, 1.5rem);
+      z-index: 1;
+    }
+
+    33.3%, 59.94%  {
+      -webkit-transform: translate(0px, 0px);
+              transform: translate(0px, 0px);
+      z-index: 0;
+    }
+
+    59.95%,66.5%   {
+      z-index: 2;
+    }
+
+    66.6%, 100% {
+      -webkit-transform: translate(3rem, 3rem);
+              transform: translate(3rem, 3rem);
+      z-index: 2;
+    }
+  }
 }
 
-/* Typography classes */
-
 .scrollbar-hide::-webkit-scrollbar {
   width: 0;
   height: 0;
@@ -6168,6 +7173,22 @@ select {
   border-top-color: rgb(13 65 198 / var(--tw-border-opacity));
 }
 
+.first\:ml-0:first-child {
+  margin-left: 0px;
+}
+
+.last\:mr-0:last-child {
+  margin-right: 0px;
+}
+
+.last\:border-b-0:last-child {
+  border-bottom-width: 0px;
+}
+
+.last\:pb-0:last-child {
+  padding-bottom: 0px;
+}
+
 .checked\:border-blue-600:checked {
   --tw-border-opacity: 1;
   border-color: rgb(30 86 227 / var(--tw-border-opacity));
@@ -6182,18 +7203,6 @@ select {
   z-index: 10;
 }
 
-.hover\:translate-x-4:hover {
-  --tw-translate-x: 1rem;
-  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-
-.hover\:translate-y-4:hover {
-  --tw-translate-y: 1rem;
-  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-
 .hover\:scale-125:hover {
   --tw-scale-x: 1.25;
   --tw-scale-y: 1.25;
@@ -6201,22 +7210,6 @@ select {
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-@-webkit-keyframes bounce {
-  0%, 100% {
-    -webkit-transform: translateY(-25%);
-            transform: translateY(-25%);
-    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);
-            animation-timing-function: cubic-bezier(0.8,0,1,1);
-  }
-
-  50% {
-    -webkit-transform: none;
-            transform: none;
-    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);
-            animation-timing-function: cubic-bezier(0,0,0.2,1);
-  }
-}
-
 @keyframes bounce {
   0%, 100% {
     -webkit-transform: translateY(-25%);
@@ -6339,11 +7332,6 @@ select {
   border-color: rgb(210 214 219 / var(--tw-border-opacity));
 }
 
-.hover\:bg-\[\#333333\]:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(51 51 51 / var(--tw-bg-opacity));
-}
-
 .hover\:bg-amber-300:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(255 206 112 / var(--tw-bg-opacity));
@@ -6419,10 +7407,6 @@ select {
   color: rgb(17 25 39 / var(--tw-text-opacity));
 }
 
-.hover\:underline:hover {
-  text-decoration-line: underline;
-}
-
 .hover\:shadow:hover {
   --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
@@ -6451,10 +7435,6 @@ select {
   transition-delay: 100ms;
 }
 
-.hover\:delay-300:hover {
-  transition-delay: 300ms;
-}
-
 .hover\:duration-300:hover {
   transition-duration: 300ms;
 }
@@ -6463,6 +7443,10 @@ select {
   transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 
+.hover\:ease-in-out:hover {
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
 .hover\:ease-out:hover {
   transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
 }
@@ -6527,11 +7511,6 @@ select {
   border-color: rgb(225 58 124 / var(--tw-border-opacity));
 }
 
-.focus\:bg-\[\#333333\]:focus {
-  --tw-bg-opacity: 1;
-  background-color: rgb(51 51 51 / var(--tw-bg-opacity));
-}
-
 .focus\:bg-blue-100:focus {
   --tw-bg-opacity: 1;
   background-color: rgb(240 244 255 / var(--tw-bg-opacity));
@@ -6577,10 +7556,6 @@ select {
   color: rgb(17 25 39 / var(--tw-text-opacity));
 }
 
-.focus\:underline:focus {
-  text-decoration-line: underline;
-}
-
 .focus\:shadow-\[0_0px_0px_4px_\#DFE8FF\]:focus {
   --tw-shadow: 0 0px 0px 4px #DFE8FF;
   --tw-shadow-colored: 0 0px 0px 4px var(--tw-shadow-color);
@@ -6593,12 +7568,6 @@ select {
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
-.focus\:shadow-\[0px_0px_0px_4px_\#D2D6DB\]:focus {
-  --tw-shadow: 0px 0px 0px 4px #D2D6DB;
-  --tw-shadow-colored: 0px 0px 0px 4px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
-
 .focus\:shadow-\[0px_0px_0px_4px_\#DFE8FF\]:focus {
   --tw-shadow: 0px 0px 0px 4px #DFE8FF;
   --tw-shadow-colored: 0px 0px 0px 4px var(--tw-shadow-color);
@@ -6617,12 +7586,6 @@ select {
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
-.focus\:shadow-\[0px_0px_0px_4px_\#F3F4F6\]:focus {
-  --tw-shadow: 0px 0px 0px 4px #F3F4F6;
-  --tw-shadow-colored: 0px 0px 0px 4px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
-
 .focus\:outline-none:focus {
   outline: 2px solid transparent;
   outline-offset: 2px;
@@ -6746,10 +7709,6 @@ select {
   visibility: visible;
 }
 
-.group:hover .group-hover\:block {
-  display: block;
-}
-
 .group:hover .group-hover\:translate-x-\[0\.15rem\] {
   --tw-translate-x: 0.15rem;
   -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -6782,16 +7741,20 @@ select {
   transition-duration: 150ms;
 }
 
-.group:hover .group-hover\:delay-300 {
-  transition-delay: 300ms;
+.group:hover .group-hover\:delay-100 {
+  transition-delay: 100ms;
+}
+
+.group:hover .group-hover\:duration-100 {
+  transition-duration: 100ms;
 }
 
 .group:hover .group-hover\:duration-300 {
   transition-duration: 300ms;
 }
 
-.group:hover .group-hover\:ease-out {
-  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+.group:hover .group-hover\:ease-in-out {
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 .group:focus .group-focus\:stroke-neutral-0 {
@@ -6914,10 +7877,34 @@ select {
     visibility: visible;
   }
 
+  .tb\:mb-16 {
+    margin-bottom: 4rem;
+  }
+
   .tb\:ml-0 {
     margin-left: 0px;
   }
 
+  .tb\:mt-10 {
+    margin-top: 2.5rem;
+  }
+
+  .tb\:mt-4 {
+    margin-top: 1rem;
+  }
+
+  .tb\:mt-8 {
+    margin-top: 2rem;
+  }
+
+  .tb\:mt-\[-4px\] {
+    margin-top: -4px;
+  }
+
+  .tb\:block {
+    display: block;
+  }
+
   .tb\:flex {
     display: flex;
   }
@@ -6930,16 +7917,68 @@ select {
     display: none;
   }
 
+  .tb\:h-full {
+    height: 100%;
+  }
+
+  .tb\:max-h-\[25\.25rem\] {
+    max-height: 25.25rem;
+  }
+
+  .tb\:w-1\/2 {
+    width: 50%;
+  }
+
+  .tb\:w-\[90\%\] {
+    width: 90%;
+  }
+
   .tb\:w-fit {
     width: -webkit-fit-content;
     width: -moz-fit-content;
     width: fit-content;
   }
 
+  .tb\:w-full {
+    width: 100%;
+  }
+
   .tb\:min-w-\[18rem\] {
     min-width: 18rem;
   }
 
+  .tb\:min-w-\[310px\] {
+    min-width: 310px;
+  }
+
+  .tb\:max-w-\[17rem\] {
+    max-width: 17rem;
+  }
+
+  .tb\:max-w-\[21rem\] {
+    max-width: 21rem;
+  }
+
+  .tb\:max-w-\[25rem\] {
+    max-width: 25rem;
+  }
+
+  .tb\:max-w-\[290px\] {
+    max-width: 290px;
+  }
+
+  .tb\:max-w-\[530px\] {
+    max-width: 530px;
+  }
+
+  .tb\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  .tb\:grid-cols-4 {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+
   .tb\:flex-col {
     flex-direction: column;
   }
@@ -6948,14 +7987,73 @@ select {
     align-items: center;
   }
 
+  .tb\:justify-start {
+    justify-content: flex-start;
+  }
+
+  .tb\:justify-center {
+    justify-content: center;
+  }
+
+  .tb\:gap-0 {
+    gap: 0px;
+  }
+
+  .tb\:gap-16 {
+    gap: 4rem;
+  }
+
+  .tb\:gap-\[31\.5rem\] {
+    gap: 31.5rem;
+  }
+
   .tb\:rounded-2xl {
     border-radius: 1rem;
   }
 
+  .tb\:rounded-e-none {
+    border-start-end-radius: 0px;
+    border-end-end-radius: 0px;
+  }
+
+  .tb\:p-16 {
+    padding: 4rem;
+  }
+
   .tb\:p-8 {
     padding: 2rem;
   }
 
+  .tb\:px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
+  .tb\:px-8 {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+
+  .tb\:pb-8 {
+    padding-bottom: 2rem;
+  }
+
+  .tb\:pr-0 {
+    padding-right: 0px;
+  }
+
+  .tb\:pt-8 {
+    padding-top: 2rem;
+  }
+
+  .tb\:text-left {
+    text-align: left;
+  }
+
+  .tb\:text-center {
+    text-align: center;
+  }
+
   .tb\:text-hds-t-body1 {
     font-size: 1rem;
     line-height: 1.75rem;
@@ -7248,10 +8346,6 @@ select {
     width: 3rem;
   }
 
-  .sm\:max-w-sm {
-    max-width: 24rem;
-  }
-
   .sm\:flex-auto {
     flex: 1 1 auto;
   }
@@ -7372,6 +8466,73 @@ select {
   }
 }
 
+@media (min-width: 905px) {
+  .tb-l\:mb-0 {
+    margin-bottom: 0px;
+  }
+
+  .tb-l\:ml-\[-4px\] {
+    margin-left: -4px;
+  }
+
+  .tb-l\:mt-0 {
+    margin-top: 0px;
+  }
+
+  .tb-l\:block {
+    display: block;
+  }
+
+  .tb-l\:flex {
+    display: flex;
+  }
+
+  .tb-l\:w-1\/2 {
+    width: 50%;
+  }
+
+  .tb-l\:w-\[70\%\] {
+    width: 70%;
+  }
+
+  .tb-l\:min-w-\[400px\] {
+    min-width: 400px;
+  }
+
+  .tb-l\:justify-start {
+    justify-content: flex-start;
+  }
+
+  .tb-l\:gap-0 {
+    gap: 0px;
+  }
+
+  .tb-l\:gap-36 {
+    gap: 9rem;
+  }
+
+  .tb-l\:self-center {
+    align-self: center;
+  }
+
+  .tb-l\:bg-gradient-to-r {
+    background-image: linear-gradient(to right, var(--tw-gradient-stops));
+  }
+
+  .tb-l\:p-10 {
+    padding: 2.5rem;
+  }
+
+  .tb-l\:py-12 {
+    padding-top: 3rem;
+    padding-bottom: 3rem;
+  }
+
+  .tb-l\:text-left {
+    text-align: left;
+  }
+}
+
 @media (min-width: 1024px) {
   .lg\:flex {
     display: flex;
@@ -7421,12 +8582,137 @@ select {
     right: -1.25rem;
   }
 
+  .db\:mb-5 {
+    margin-bottom: 1.25rem;
+  }
+
+  .db\:ml-0 {
+    margin-left: 0px;
+  }
+
+  .db\:inline {
+    display: inline;
+  }
+
+  .db\:flex {
+    display: flex;
+  }
+
+  .db\:w-1\/2 {
+    width: 50%;
+  }
+
+  .db\:w-\[36\%\] {
+    width: 36%;
+  }
+
+  .db\:w-\[72\%\] {
+    width: 72%;
+  }
+
+  .db\:w-\[75\%\] {
+    width: 75%;
+  }
+
   .db\:w-fit {
     width: -webkit-fit-content;
     width: -moz-fit-content;
     width: fit-content;
   }
 
+  .db\:w-full {
+    width: 100%;
+  }
+
+  .db\:min-w-\[625px\] {
+    min-width: 625px;
+  }
+
+  .db\:max-w-\[500px\] {
+    max-width: 500px;
+  }
+
+  .db\:max-w-\[625px\] {
+    max-width: 625px;
+  }
+
+  .db\:grid-cols-4 {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+
+  .db\:justify-start {
+    justify-content: flex-start;
+  }
+
+  .db\:gap-0 {
+    gap: 0px;
+  }
+
+  .db\:gap-36 {
+    gap: 9rem;
+  }
+
+  .db\:gap-x-8 {
+    -webkit-column-gap: 2rem;
+            column-gap: 2rem;
+  }
+
+  .db\:gap-y-2 {
+    row-gap: 0.5rem;
+  }
+
+  .db\:px-20 {
+    padding-left: 5rem;
+    padding-right: 5rem;
+  }
+
+  .db\:px-28 {
+    padding-left: 7rem;
+    padding-right: 7rem;
+  }
+
+  .db\:px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
+  .db\:py-20 {
+    padding-top: 5rem;
+    padding-bottom: 5rem;
+  }
+
+  .db\:pb-10 {
+    padding-bottom: 2.5rem;
+  }
+
+  .db\:pb-28 {
+    padding-bottom: 7rem;
+  }
+
+  .db\:pl-28 {
+    padding-left: 7rem;
+  }
+
+  .db\:pr-0 {
+    padding-right: 0px;
+  }
+
+  .db\:pt-20 {
+    padding-top: 5rem;
+  }
+
+  .db\:pt-28 {
+    padding-top: 7rem;
+  }
+
+  .db\:pt-32 {
+    padding-top: 8rem;
+  }
+
+  .db\:text-left {
+    text-align: left;
+  }
+
   .db\:text-hds-d-body1 {
     font-size: 1rem;
     line-height: 1.75rem;
@@ -7671,4 +8957,12 @@ select {
     letter-spacing: -0.01em;
     font-weight: 400;
   }
+}
+
+.\[\&\>\*\]\:mb-8>* {
+  margin-bottom: 2rem;
+}
+
+.last\:\[\&\>\*\]\:mb-0>*:last-child {
+  margin-bottom: 0px;
 }