@alfalab/core-components-tabs 10.0.7 → 10.0.8-alfasans

package/components/primary-tablist/index.css

@@ -28,11 +28,9 @@
     --gap-4-neg: var(--gap-2xs-neg);
 }
 :root {
-    --font-family-system:
-        system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
-    --font-family-styrene:
-        'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
-        sans-serif;
+    --font-family-alfasans:
+        'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
+        Helvetica, sans-serif;
 }
 :root {
     --focus-color: var(--color-light-status-info);
@@ -54,12 +52,12 @@
     --primary-tablist-xl-gaps: var(--gap-32);
     --primary-tablist-xl-padding: var(--gap-4) var(--gap-0) var(--gap-24);
 }
-.tabs__component_1psse {
+.tabs__component_1hn1u {
     position: relative;
     display: inline-flex;
     min-width: 100%;
 }
-.tabs__component_1psse:before {
+.tabs__component_1hn1u:before {
         content: '';
         display: block;
         position: absolute;
@@ -68,361 +66,375 @@
         width: 100%;
         background-color: var(--primary-tablist-bottom-border-color);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__title_1hn1u {
         font-size: 18px;
         line-height: 24px;
         font-weight: 400;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.36px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__title_1hn1u {
         font-size: 16px;
         line-height: 24px;
         font-weight: 400;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.24px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__title_1hn1u {
         font-size: 14px;
         line-height: 20px;
         font-weight: 400;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.08px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__title_1hn1u {
         font-size: 18px;
         line-height: 24px;
         font-weight: 500;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.17px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__title_1hn1u {
         font-size: 16px;
         line-height: 24px;
         font-weight: 500;
-        font-family: var(--font-family-system);
+        letter-spacing: -0.05px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__title_1hn1u {
         font-size: 14px;
         line-height: 20px;
         font-weight: 500;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.07px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__title_1hn1u {
         font-size: 18px;
         line-height: 24px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.38px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__title_1hn1u {
         font-size: 16px;
         line-height: 24px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.43px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__title_1hn1u {
         font-size: 14px;
         line-height: 20px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.47px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(24px / 2);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 24px;
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 24px;
             height: 24px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__paragraph-primary-large_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__paragraph-primary-medium_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__accent-primary-large_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__accent-primary-medium_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__action-primary-large_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__action-primary-medium_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-large_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__paragraph-primary-medium_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__accent-primary-large_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__accent-primary-medium_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__action-primary-large_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__action-primary-medium_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(24px / 2);
         }
-.tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(20px / 2);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 20px;
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 20px;
             height: 20px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__paragraph-primary-small_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__accent-primary-small_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__action-primary-small_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__paragraph-primary-small_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__accent-primary-small_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__action-primary-small_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(20px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__title_1hn1u {
         font-size: 48px;
         line-height: 52px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__title_1hn1u {
         font-size: 40px;
         line-height: 48px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__title_1hn1u {
         font-size: 30px;
         line-height: 36px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__title_1hn1u {
         font-size: 22px;
         line-height: 26px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.2px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__title_1hn1u {
         font-size: 18px;
         line-height: 22px;
         font-weight: 700;
-        font-family: var(--font-family-system);
+        letter-spacing: 0.38px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__title_1hn1u {
         font-size: 48px;
         line-height: 64px;
-        font-weight: 500;
-        font-feature-settings: 'ss01';
-        font-family: var(--font-family-styrene);
+        font-weight: 700;
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-large_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__title_1hn1u {
         font-size: 40px;
         line-height: 48px;
-        font-weight: 500;
-        font-feature-settings: 'ss01';
-        font-family: var(--font-family-styrene);
+        font-weight: 700;
+        letter-spacing: 0.1px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__title_1hn1u {
         font-size: 32px;
         line-height: 40px;
-        font-weight: 500;
-        font-feature-settings: 'ss01';
-        font-family: var(--font-family-styrene);
+        font-weight: 700;
+        letter-spacing: 0.3px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__title_1hn1u {
         font-size: 24px;
         line-height: 32px;
-        font-weight: 500;
-        font-feature-settings: 'ss01';
-        font-family: var(--font-family-styrene);
+        font-weight: 700;
+        letter-spacing: 0.39px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__title_1hn1u {
         font-size: 20px;
         line-height: 24px;
-        font-weight: 500;
-        font-feature-settings: 'ss01';
-        font-family: var(--font-family-styrene);
+        font-weight: 700;
+        letter-spacing: 0.33px;
+        font-family: var(--font-family-alfasans);
     }
-.tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(52px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 52px;
     }
-.tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 52px;
             height: 52px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-system-xlarge_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-system-xlarge_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(52px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__title_1psse, .tabs__desktop_1psse.tabs__headline-large_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__title_1hn1u, .tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(48px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-large_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__pickerWrapper_1psse,
-    .tabs__desktop_1psse.tabs__headline-large_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__pickerWrapper_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 48px;
     }
-.tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__option_1psse, .tabs__desktop_1psse.tabs__headline-large_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__option_1hn1u, .tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__scrollControls_1psse > button, .tabs__desktop_1psse.tabs__headline-large_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__scrollControls_1hn1u > button, .tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 48px;
             height: 48px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-system-large_1psse .tabs__scrollControls_1psse button:first-child, .tabs__desktop_1psse.tabs__headline-large_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-system-large_1hn1u .tabs__scrollControls_1hn1u button:first-child, .tabs__desktop_1hn1u.tabs__headline-large_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(48px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(36px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 36px;
     }
-.tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 36px;
             height: 36px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-system-medium_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-system-medium_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(36px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(26px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 26px;
     }
-.tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 26px;
             height: 26px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-system-small_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-system-small_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(26px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(22px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 22px;
     }
-.tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 22px;
             height: 22px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-system-xsmall_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-system-xsmall_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(22px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(64px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 64px;
     }
-.tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 64px;
             height: 64px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-xlarge_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-xlarge_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(64px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(40px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 40px;
     }
-.tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 40px;
             height: 40px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-medium_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-medium_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(40px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-small_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(32px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-small_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-small_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 32px;
     }
-.tabs__desktop_1psse.tabs__headline-small_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-small_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 32px;
             height: 32px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-small_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-small_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(32px / 2);
         }
-.tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__title_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__title_1hn1u {
         padding-bottom: calc(24px / 2);
     }
-.tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__title_1psse + .tabs__title_1psse,
-    .tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__pickerWrapper_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u,
+    .tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: 24px;
     }
-.tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__option_1psse {
+.tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__scrollControls_1psse > button {
+.tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__scrollControls_1hn1u > button {
             box-sizing: content-box;
             width: 24px;
             height: 24px;
             padding: var(--gap-0);
         }
-.tabs__desktop_1psse.tabs__headline-xsmall_1psse .tabs__scrollControls_1psse button:first-child {
+.tabs__desktop_1hn1u.tabs__headline-xsmall_1hn1u .tabs__scrollControls_1hn1u button:first-child {
             margin: var(--gap-0) var(--gap-0) var(--gap-0) calc(24px / 2);
         }
-.tabs__fullWidthScroll_1psse {
+.tabs__fullWidthScroll_1hn1u {
     min-width: calc(100% - 2 * var(--gap-16));
     margin: var(--gap-0) var(--gap-16);
 }
-.tabs__container_1psse {
+.tabs__container_1hn1u {
     position: relative;
     overflow: hidden;
     margin: var(--gap-4-neg) var(--gap-0) var(--gap-4-neg) var(--gap-4-neg);
     padding: var(--gap-4) var(--gap-0) var(--gap-4) var(--gap-4);
 }
-.tabs__title_1psse {
+.tabs__title_1hn1u {
     display: flex;
     align-items: center;
     height: 100%;
@@ -439,26 +451,26 @@
             user-select: none;
     outline: none;
 }
-.tabs__title_1psse:not(:disabled):hover {
+.tabs__title_1hn1u:not(:disabled):hover {
         color: var(--primary-tablist-hover-color);
     }
-.tabs__focused_1psse {
+.tabs__focused_1hn1u {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
-.tabs__collapsed_1psse {
+.tabs__collapsed_1hn1u {
     order: 99;
     visibility: collapse;
 }
-.tabs__selected_1psse {
+.tabs__selected_1hn1u {
     cursor: default;
     color: var(--primary-tablist-selected-color);
 }
-.tabs__disabled_1psse {
+.tabs__disabled_1hn1u {
     cursor: var(--disabled-cursor);
     color: var(--primary-tablist-disabled-color);
 }
-.tabs__line_1psse {
+.tabs__line_1hn1u {
     position: absolute;
     height: 3px;
     bottom: calc(var(--gap-2) / 2);
@@ -468,69 +480,70 @@
         transform 0.2s ease,
         width 0.2s ease;
 }
-.tabs__option_1psse {
+.tabs__option_1hn1u {
     color: var(--color-light-text-primary);
 }
-.tabs__s_1psse .tabs__title_1psse, .tabs__xs_1psse .tabs__title_1psse, .tabs__xxs_1psse .tabs__title_1psse {
+.tabs__s_1hn1u .tabs__title_1hn1u, .tabs__xs_1hn1u .tabs__title_1hn1u, .tabs__xxs_1hn1u .tabs__title_1hn1u {
         padding: var(--primary-tablist-s-padding);
     }
-.tabs__s_1psse .tabs__title_1psse + .tabs__title_1psse, .tabs__xs_1psse .tabs__title_1psse + .tabs__title_1psse, .tabs__xxs_1psse .tabs__title_1psse + .tabs__title_1psse {
+.tabs__s_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u, .tabs__xs_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u, .tabs__xxs_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u {
         margin-left: var(--primary-tablist-s-gaps);
     }
-.tabs__s_1psse .tabs__pickerWrapper_1psse, .tabs__xs_1psse .tabs__pickerWrapper_1psse, .tabs__xxs_1psse .tabs__pickerWrapper_1psse {
+.tabs__s_1hn1u .tabs__pickerWrapper_1hn1u, .tabs__xs_1hn1u .tabs__pickerWrapper_1hn1u, .tabs__xxs_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: var(--primary-tablist-s-gaps);
     }
-.tabs__s_1psse .tabs__option_1psse, .tabs__xs_1psse .tabs__option_1psse, .tabs__xxs_1psse .tabs__option_1psse {
+.tabs__s_1hn1u .tabs__option_1hn1u, .tabs__xs_1hn1u .tabs__option_1hn1u, .tabs__xxs_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__m_1psse .tabs__title_1psse {
+.tabs__m_1hn1u .tabs__title_1hn1u {
         padding: var(--primary-tablist-m-padding);
     }
-.tabs__m_1psse .tabs__title_1psse + .tabs__title_1psse {
+.tabs__m_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u {
         margin-left: var(--primary-tablist-m-gaps);
     }
-.tabs__m_1psse .tabs__pickerWrapper_1psse {
+.tabs__m_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: var(--primary-tablist-m-gaps);
     }
-.tabs__m_1psse .tabs__option_1psse {
+.tabs__m_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__l_1psse .tabs__title_1psse {
+.tabs__l_1hn1u .tabs__title_1hn1u {
         padding: var(--primary-tablist-l-padding);
     }
-.tabs__l_1psse .tabs__title_1psse + .tabs__title_1psse {
+.tabs__l_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u {
         margin-left: var(--primary-tablist-l-gaps);
     }
-.tabs__l_1psse .tabs__pickerWrapper_1psse {
+.tabs__l_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: var(--primary-tablist-l-gaps);
     }
-.tabs__l_1psse .tabs__option_1psse {
+.tabs__l_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__xl_1psse .tabs__title_1psse {
+.tabs__xl_1hn1u .tabs__title_1hn1u {
         padding: var(--primary-tablist-xl-padding);
     }
-.tabs__xl_1psse .tabs__title_1psse + .tabs__title_1psse {
+.tabs__xl_1hn1u .tabs__title_1hn1u + .tabs__title_1hn1u {
         margin-left: var(--primary-tablist-xl-gaps);
     }
-.tabs__xl_1psse .tabs__pickerWrapper_1psse {
+.tabs__xl_1hn1u .tabs__pickerWrapper_1hn1u {
         margin-left: var(--primary-tablist-xl-gaps);
     }
-.tabs__xl_1psse .tabs__option_1psse {
+.tabs__xl_1hn1u .tabs__option_1hn1u {
         padding: var(--gap-0);
     }
-.tabs__rightAddons_1psse {
+.tabs__rightAddons_1hn1u {
     display: flex;
     justify-content: center;
     align-items: center;
     margin-left: var(--gap-8);
 }
-.tabs__rightAddonsMarginZero_1psse {
+.tabs__rightAddonsMarginZero_1hn1u {
     margin-left: var(--gap-0);
 }
-.tabs__title_1psse.tabs__noTextStyle_1psse {
+.tabs__title_1hn1u.tabs__noTextStyle_1hn1u {
     font-size: 18px;
     line-height: 24px;
     font-weight: 400;
-    font-family: var(--font-family-system);
+    letter-spacing: -0.36px;
+    font-family: var(--font-family-alfasans);
 }