diff --git a/index.html b/index.html
index 51a62e3..748bfba 100644
--- a/index.html
+++ b/index.html
@@ -68,7 +68,6 @@
         <li><a href="./patterns/vsf-list-card.html">VSF List Card</a></li>
         <li><a href="./patterns/vsf-card-listen-seite.html">VSF Card Listen Seite</a></li>
         <li><a href="./patterns/vsf-list-detailseite.html">VSF List Detailseite</a></li>
-        <li><a href="./patterns/vsf-listen-uebersicht-seite.html">VSF Listen Übersicht Seite</a></li>
         <li><a href="./patterns/vsf-listen-uebersicht-seite-v2.html">VSF Listen Übersicht Seite V2</a></li>
         <li><a href="./patterns/vsf-card-listen-fundamentalanalyse-mobile.html">VSF Card Listen Fundamentalanalyse Mobile</a></li>
         <li><a href="./patterns/vsf-card-listen-fundamentalanalyse-drawer.html">VSF Card Listen Fundamentalanalyse Drawer</a></li>
diff --git a/patterns/vsf-listen-uebersicht-seite.html b/patterns/vsf-listen-uebersicht-seite.html
deleted file mode 100644
index 39f9452..0000000
--- a/patterns/vsf-listen-uebersicht-seite.html
+++ /dev/null
@@ -1,651 +0,0 @@
-<!doctype html>
-<html lang="de">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Styleguide – VSF Listen Übersicht Seite</title>
-  <link rel="stylesheet" href="../styleguide.css">
-</head>
-<body>
-
-  <h1 class="sg-main-heading">Layout – VSF Listen Übersicht Seite</h1>
-
-  <section class="sg-vsf-list-detail-page" aria-label="VSF Listen Übersicht Seite">
-    <header class="sg-portal-header" aria-label="Portal Header" data-pattern="portal-header">
-      <div class="sg-portal-header__main" data-pattern-part="portal-header-main">
-        <p class="sg-portal-header__brand sg-brand-title" data-pattern-part="portal-header-brand">ValueStockFinder</p>
-
-        <div class="sg-portal-header__menu-wrap sg-sandwich-menu-wrap" data-open="false" data-component="sandwich-menu" data-component-size="default" data-component-context="portal-header" data-pattern-part="portal-header-action">
-          <button class="sg-interaction-element sg-sandwich-button" type="button" aria-expanded="false" aria-label="Menü öffnen" data-component-part="sandwich-trigger">
-            <span class="sg-sandwich-button__icon" aria-hidden="true">
-              <span class="sg-sandwich-button__line"></span>
-              <span class="sg-sandwich-button__line"></span>
-              <span class="sg-sandwich-button__line"></span>
-            </span>
-          </button>
-
-          <div class="sg-sandwich-menu-panel" aria-label="Ausgeklapptes Menü" data-component-part="sandwich-panel">
-            <a class="sg-sandwich-menu-link" href="#" data-component-part="sandwich-menu-link">Admin</a>
-            <a class="sg-sandwich-menu-link" href="#" data-component-part="sandwich-menu-link">Logout</a>
-          </div>
-        </div>
-
-        <nav class="sg-portal-header__tabs sg-tab-button-group" aria-label="Hauptnavigation" data-component="tab-navigation" data-component-size="large" data-component-context="portal-header" data-pattern-part="portal-header-navigation">
-          <button class="sg-interaction-element sg-button sg-tab-button" type="button" aria-selected="false" data-component-part="tab-button" data-component-state="inactive">Updates</button>
-          <button class="sg-interaction-element sg-button sg-tab-button" type="button" aria-selected="false" data-component-part="tab-button" data-component-state="inactive">Titel</button>
-          <button class="sg-interaction-element sg-button sg-tab-button" type="button" aria-selected="false" data-component-part="tab-button" data-component-state="inactive">Gruppen</button>
-          <button class="sg-interaction-element sg-button sg-tab-button" type="button" aria-selected="true" data-component-part="tab-button" data-component-state="active">Listen</button>
-        </nav>
-      </div>
-    </header>
-
-    <div class="sg-options-row" aria-label="Optionszeile" data-pattern="options-row">
-      <div class="sg-options-row__left" data-pattern-part="options-row-primary-actions">
-        <div class="sg-pulldown-demo" data-open="false" data-align="left" data-selection-mode="single" data-component="pulldown" data-component-context="options-row" data-component-state="inactive-selectable">
-          <button class="sg-interaction-element sg-pulldown sg-pulldown-demo__trigger" type="button" aria-expanded="false" aria-label="Pulldown Sortierung" data-component-part="pulldown-trigger" data-label-base="Sortierung">
-            Sortierung
-          </button>
-
-          <div class="sg-pulldown-panel" aria-label="Geöffnetes Pulldown Sortierung" data-component-part="pulldown-panel">
-            <ul class="sg-pulldown-option-list" aria-label="Sortierungsoptionen">
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 1</span></li>
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 2</span></li>
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 3</span></li>
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 4</span></li>
-              <li class="sg-pulldown-option sg-pulldown-option--disabled"><span>Menüpunkt 5</span></li>
-            </ul>
-          </div>
-        </div>
-
-        <div class="sg-pulldown-demo" data-open="false" data-align="left" data-selection-mode="single" data-component="pulldown" data-component-context="options-row" data-component-state="inactive-selectable">
-          <button class="sg-interaction-element sg-pulldown sg-pulldown-demo__trigger" type="button" aria-expanded="false" aria-label="Pulldown Region" data-component-part="pulldown-trigger" data-label-base="Region">
-            Region
-          </button>
-
-          <div class="sg-pulldown-panel" aria-label="Geöffnetes Pulldown Region" data-component-part="pulldown-panel">
-            <ul class="sg-pulldown-option-list" aria-label="Regionsoptionen">
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 1</span></li>
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 2</span></li>
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 3</span></li>
-              <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Menüpunkt 4</span></li>
-              <li class="sg-pulldown-option sg-pulldown-option--disabled"><span>Menüpunkt 5</span></li>
-            </ul>
-          </div>
-        </div>
-
-        <div class="sg-search-field-row">
-          <span class="sg-input-single-line-wrap sg-search-field-input" data-has-value="false" data-component="single-line-input" data-component-context="options-row" data-component-state="inactive-selectable">
-            <input class="sg-interaction-element sg-input-single-line" type="text" placeholder="Suche" aria-label="Suche">
-            <button class="sg-input-clear-button" type="button" aria-label="Eingabe löschen" data-component-part="input-clear-button">×</button>
-          </span>
-          <span class="sg-search-result-count sg-table-label" aria-live="polite" data-pattern-part="options-row-search-result-count">0 Treffer</span>
-        </div>
-      </div>
-
-      <div class="sg-options-row__right" data-pattern-part="options-row-secondary-actions">
-        <button class="sg-mode-toggle" type="button" data-active="relative" aria-label="Modus Schieber global: relativ aktiv" data-component="mode-toggle" data-component-context="options-row">
-          <span class="sg-mode-toggle__label" data-component-part="toggle-label">absolut</span>
-          <span class="sg-mode-toggle__switch" aria-hidden="true" data-component-part="toggle-track">
-            <span class="sg-mode-toggle__handle" data-component-part="toggle-handle"></span>
-          </span>
-          <span class="sg-mode-toggle__label" data-component-part="toggle-label">relativ</span>
-        </button>
-
-        <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon" data-component-context="options-row">
-          <button class="sg-help-icon" type="button" aria-expanded="false" aria-label="Hilfetext anzeigen" data-component-part="help-trigger">?</button>
-          <span class="sg-help-icon-panel sg-table-label" role="tooltip" data-component-part="help-panel">
-            Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt.
-          </span>
-        </span>
-      </div>
-    </div>
-
-    <div class="sg-transparent-card sg-vsf-list-detail-page__intro-block" aria-label="Einleitung zur VSF Listenübersicht" data-component="transparent-card">
-      <div class="sg-vsf-list-detail-page__title-row">
-        <h1 class="sg-heading-h1 sg-text-on-dark sg-vsf-list-detail-page__title">TITEL DER LISTE</h1>
-      </div>
-      <p class="sg-body sg-text-layout-pattern__sample sg-text-layout-pattern__sample--sixty-width">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer convallis purus sed urna ultricies, id aliquet justo malesuada. Morbi luctus, augue in cursus ultrices, justo lorem posuere mi, at suscipit est turpis vitae ipsum. Praesent posuere nisl a nisl fermentum, nec feugiat odio volutpat. Nam id dictum justo, eget dapibus arcu. Fusce varius justo nec nibh gravida, sed dignissim est tempor.</p>
-    </div>
-
-    <div id="layout-vsf-list-card">
-    <div class="sg-object-card-grid" aria-label="VSF Listen Übersicht Karten">
-    <div class="sg-delete-confirmation-pattern sg-delete-confirmation-pattern__stage sg-object-card" data-pattern="overlay-card" data-dialog-open="false" aria-label="VSF List Card Layout List Card">
-      <article class="sg-card sg-delete-confirmation-pattern__target" data-pattern="object-group-card" aria-label="List Card">
-        <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="object-group-card-header">
-          <div class="sg-strong">NAME DER LISTE</div>
-          <div class="sg-sandwich-menu-wrap" data-open="false" data-align="right" data-component="sandwich-menu" data-component-size="small">
-            <button class="sg-interaction-element sg-sandwich-button sg-sandwich-button--small" type="button" aria-expanded="false" aria-label="Menü öffnen" data-component-part="sandwich-trigger">
-              <span class="sg-sandwich-button__icon" aria-hidden="true">
-                <span class="sg-sandwich-button__line"></span>
-                <span class="sg-sandwich-button__line"></span>
-                <span class="sg-sandwich-button__line"></span>
-              </span>
-            </button>
-            <div class="sg-sandwich-menu-panel" aria-label="Ausgeklapptes Menü" data-component-part="sandwich-panel">
-              <a class="sg-sandwich-menu-link" href="#!" data-overlay-open-dialog="edit">Editieren</a>
-              <a class="sg-sandwich-menu-link" href="#!" data-overlay-open-dialog="delete">Liste loeschen</a>
-            </div>
-          </div>
-        </header>
-        <div class="sg-card-segment sg-card-segment--body sg-card-segment--gray" data-pattern-part="list-card-placeholder-top">
-          <div class="sg-score-bar-list sg-score-bar-list--single-score" aria-label="Gesamtscore-Balken" data-component="score-bar-list">
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Medianscore:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" role="img" aria-label="Gesamtscore 96 Prozent mit Median-Marker bei 50 Prozent" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--positive sg-score-bar__value--w96" data-component-part="score-value" data-component-state="positive"></div>
-              </div>
-              <p class="sg-bar-label sg-score-state--positive" data-component-part="score-state">attraktiv</p>
-            </div>
-          </div>
-        </div>
-        <div class="sg-card-segment sg-card-segment--body sg-card-segment--gray" data-pattern-part="list-card-placeholder-bottom">
-          <div class="sg-text-layout-pattern__sample sg-text-layout-pattern__three-column-distributed" aria-label="Company Kennzahlen dreispaltig verteilt" data-pattern-part="company-card-metrics-three-column">
-            <p class="sg-body sg-text-layout-pattern__column sg-text-layout-pattern__column--align-left">
-              PE: <span class="sg-data-table__value">28.8</span>
-            </p>
-            <p class="sg-body sg-text-layout-pattern__column sg-text-layout-pattern__column--align-center">
-              PE forw.: <span class="sg-data-table__value sg-company-card__metric-negative" data-component-state="negative">23.3</span>
-            </p>
-            <p class="sg-body sg-text-layout-pattern__column sg-text-layout-pattern__column--align-right">
-              PEG: <span class="sg-data-table__value sg-company-card__metric-negative" data-component-state="negative">3.54</span>
-            </p>
-          </div>
-        </div>
-        <div class="sg-card-segment sg-card-segment--body sg-card-segment--white sg-object-card__content" data-pattern-part="company-card-content">
-          <p class="sg-table-label sg-company-card__analysis-title">Median-Subscores:</p>
-          <div class="sg-score-bar-list sg-company-card__analysis-bars" aria-label="Fundamentalanalyse Score-Balken" data-component="score-bar-list">
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Marktbewertung:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--positive sg-score-bar__value--w96" data-component-part="score-value" data-component-state="positive"></div>
-              </div>
-            </div>
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Wachstum:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--neutral sg-score-bar__value--w64" data-component-part="score-value" data-component-state="neutral"></div>
-              </div>
-            </div>
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Profitabilität:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--negative sg-score-bar__value--w35" data-component-part="score-value" data-component-state="negative"></div>
-              </div>
-            </div>
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Stabilität:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--neutral sg-score-bar__value--w64" data-component-part="score-value" data-component-state="neutral"></div>
-              </div>
-            </div>
-          </div>
-          <p class="sg-body sg-company-card__summary sg-vsf-list-card__summary">BESCHREIBUNG LISTE</p>
-        </div>
-        <footer class="sg-card-segment sg-card-segment--body sg-card-segment--white" data-pattern-part="list-card-actions">
-          <div class="sg-object-card__actions">
-            <button class="sg-interaction-element sg-button sg-button--active sg-object-card__action" type="button">Unternehmen ansehen</button>
-          </div>
-        </footer>
-      </article>
-
-      <article class="sg-card sg-delete-confirmation-pattern__floating-card" aria-label="Liste editieren" role="dialog" aria-modal="true" aria-labelledby="vsf-list-card-inline-edit-title" data-overlay-dialog="edit" hidden>
-        <div class="sg-card-segment sg-card-segment--body sg-delete-confirmation-pattern__body">
-          <p class="sg-body sg-delete-confirmation-pattern__text" id="vsf-list-card-inline-edit-title"><strong>Liste editieren</strong></p>
-          <div class="sg-form-sections-card__field-group">
-            <label class="sg-labeled-input-row">
-              <span class="sg-label">Name</span>
-              <input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="text" value="NAME DER LISTE" aria-label="Name" data-vsf-edit-input>
-            </label>
-            <label class="sg-labeled-input-row">
-              <span class="sg-label">Beschreibung</span>
-              <textarea class="sg-input-multi-line sg-form-inactive-selectable" rows="4" aria-label="Beschreibung" data-vsf-edit-input>BESCHREIBUNG LISTE</textarea>
-            </label>
-          </div>
-          <div class="sg-delete-confirmation-pattern__actions">
-            <button class="sg-interaction-element sg-button sg-button--active" type="button" data-overlay-dialog-close>Abbrechen</button>
-            <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive" type="button" disabled aria-disabled="true" data-vsf-edit-save>
-              Speichern
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <article class="sg-card sg-delete-confirmation-pattern__floating-card" aria-label="Löschbestätigung" role="dialog" aria-modal="true" aria-labelledby="vsf-list-card-inline-delete-title" data-overlay-dialog="delete" hidden>
-        <div class="sg-card-segment sg-card-segment--body sg-delete-confirmation-pattern__body">
-          <p class="sg-body sg-delete-confirmation-pattern__text" id="vsf-list-card-inline-delete-title"><strong>Möchtest du NAME DER LISTE wirklich löschen?</strong></p>
-          <p class="sg-body sg-delete-confirmation-pattern__text">Du kannst das nicht rückgängig machen. Bestätige durch Eingabe von <span class="sg-delete-confirmation-pattern__code">DELETE</span>.</p>
-          <label class="sg-labeled-input-row sg-delete-confirmation-pattern__input-row">
-            <span class="sg-label">Bestätigung</span>
-            <input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="text" placeholder="DELETE" aria-label="Löschbestätigung durch DELETE" data-vsf-delete-confirmation-input>
-          </label>
-          <div class="sg-delete-confirmation-pattern__actions">
-            <button class="sg-interaction-element sg-button sg-button--active" type="button" data-overlay-dialog-close>Abbrechen</button>
-            <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive" type="button" disabled aria-disabled="true" data-vsf-delete-confirmation-submit>
-              Löschen
-            </button>
-          </div>
-        </div>
-      </article>
-    </div>
-
-    <div class="sg-delete-confirmation-pattern sg-delete-confirmation-pattern__stage sg-object-card" data-pattern="overlay-card" data-dialog-open="false" aria-label="VSF List Card Layout List Card">
-      <article class="sg-card sg-delete-confirmation-pattern__target" data-pattern="object-group-card" aria-label="List Card">
-        <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="object-group-card-header">
-          <div class="sg-strong">NAME DER LISTE</div>
-          <div class="sg-sandwich-menu-wrap" data-open="false" data-align="right" data-component="sandwich-menu" data-component-size="small">
-            <button class="sg-interaction-element sg-sandwich-button sg-sandwich-button--small" type="button" aria-expanded="false" aria-label="Menü öffnen" data-component-part="sandwich-trigger">
-              <span class="sg-sandwich-button__icon" aria-hidden="true">
-                <span class="sg-sandwich-button__line"></span>
-                <span class="sg-sandwich-button__line"></span>
-                <span class="sg-sandwich-button__line"></span>
-              </span>
-            </button>
-            <div class="sg-sandwich-menu-panel" aria-label="Ausgeklapptes Menü" data-component-part="sandwich-panel">
-              <a class="sg-sandwich-menu-link" href="#!" data-overlay-open-dialog="edit-2">Editieren</a>
-              <a class="sg-sandwich-menu-link" href="#!" data-overlay-open-dialog="delete-2">Liste loeschen</a>
-            </div>
-          </div>
-        </header>
-        <div class="sg-card-segment sg-card-segment--body sg-card-segment--gray" data-pattern-part="list-card-placeholder-top">
-          <div class="sg-score-bar-list sg-score-bar-list--single-score" aria-label="Gesamtscore-Balken" data-component="score-bar-list">
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Medianscore:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" role="img" aria-label="Gesamtscore 96 Prozent mit Median-Marker bei 50 Prozent" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--positive sg-score-bar__value--w96" data-component-part="score-value" data-component-state="positive"></div>
-              </div>
-              <p class="sg-bar-label sg-score-state--positive" data-component-part="score-state">attraktiv</p>
-            </div>
-          </div>
-        </div>
-        <div class="sg-card-segment sg-card-segment--body sg-card-segment--gray" data-pattern-part="list-card-placeholder-bottom">
-          <div class="sg-text-layout-pattern__sample sg-text-layout-pattern__three-column-distributed" aria-label="Company Kennzahlen dreispaltig verteilt" data-pattern-part="company-card-metrics-three-column">
-            <p class="sg-body sg-text-layout-pattern__column sg-text-layout-pattern__column--align-left">
-              PE: <span class="sg-data-table__value">28.8</span>
-            </p>
-            <p class="sg-body sg-text-layout-pattern__column sg-text-layout-pattern__column--align-center">
-              PE forw.: <span class="sg-data-table__value sg-company-card__metric-negative" data-component-state="negative">23.3</span>
-            </p>
-            <p class="sg-body sg-text-layout-pattern__column sg-text-layout-pattern__column--align-right">
-              PEG: <span class="sg-data-table__value sg-company-card__metric-negative" data-component-state="negative">3.54</span>
-            </p>
-          </div>
-        </div>
-        <div class="sg-card-segment sg-card-segment--body sg-card-segment--white sg-object-card__content" data-pattern-part="company-card-content">
-          <p class="sg-table-label sg-company-card__analysis-title">Median-Subscores:</p>
-          <div class="sg-score-bar-list sg-company-card__analysis-bars" aria-label="Fundamentalanalyse Score-Balken" data-component="score-bar-list">
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Marktbewertung:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--positive sg-score-bar__value--w96" data-component-part="score-value" data-component-state="positive"></div>
-              </div>
-            </div>
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Wachstum:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--neutral sg-score-bar__value--w64" data-component-part="score-value" data-component-state="neutral"></div>
-              </div>
-            </div>
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Profitabilität:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--negative sg-score-bar__value--w35" data-component-part="score-value" data-component-state="negative"></div>
-              </div>
-            </div>
-            <div class="sg-score-bar-item" data-component="score-bar">
-              <p class="sg-score-bar-label sg-bar-label" data-component-part="score-label">Stabilität:</p>
-              <div class="sg-score-bar sg-score-bar--marker-mid" data-component-part="score-track">
-                <div class="sg-score-bar__value sg-score-bar__value--neutral sg-score-bar__value--w64" data-component-part="score-value" data-component-state="neutral"></div>
-              </div>
-            </div>
-          </div>
-          <p class="sg-body sg-company-card__summary sg-vsf-list-card__summary">BESCHREIBUNG LISTE</p>
-        </div>
-        <footer class="sg-card-segment sg-card-segment--body sg-card-segment--white" data-pattern-part="list-card-actions">
-          <div class="sg-object-card__actions">
-            <button class="sg-interaction-element sg-button sg-button--active sg-object-card__action" type="button">Unternehmen ansehen</button>
-          </div>
-        </footer>
-      </article>
-
-      <article class="sg-card sg-delete-confirmation-pattern__floating-card" aria-label="Liste editieren" role="dialog" aria-modal="true" aria-labelledby="vsf-list-card-inline-edit-title-2" data-overlay-dialog="edit-2" hidden>
-        <div class="sg-card-segment sg-card-segment--body sg-delete-confirmation-pattern__body">
-          <p class="sg-body sg-delete-confirmation-pattern__text" id="vsf-list-card-inline-edit-title-2"><strong>Liste editieren</strong></p>
-          <div class="sg-form-sections-card__field-group">
-            <label class="sg-labeled-input-row">
-              <span class="sg-label">Name</span>
-              <input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="text" value="NAME DER LISTE" aria-label="Name" data-vsf-edit-input>
-            </label>
-            <label class="sg-labeled-input-row">
-              <span class="sg-label">Beschreibung</span>
-              <textarea class="sg-input-multi-line sg-form-inactive-selectable" rows="4" aria-label="Beschreibung" data-vsf-edit-input>BESCHREIBUNG LISTE</textarea>
-            </label>
-          </div>
-          <div class="sg-delete-confirmation-pattern__actions">
-            <button class="sg-interaction-element sg-button sg-button--active" type="button" data-overlay-dialog-close>Abbrechen</button>
-            <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive" type="button" disabled aria-disabled="true" data-vsf-edit-save>
-              Speichern
-            </button>
-          </div>
-        </div>
-      </article>
-
-      <article class="sg-card sg-delete-confirmation-pattern__floating-card" aria-label="Löschbestätigung" role="dialog" aria-modal="true" aria-labelledby="vsf-list-card-inline-delete-title-2" data-overlay-dialog="delete-2" hidden>
-        <div class="sg-card-segment sg-card-segment--body sg-delete-confirmation-pattern__body">
-          <p class="sg-body sg-delete-confirmation-pattern__text" id="vsf-list-card-inline-delete-title-2"><strong>Möchtest du NAME DER LISTE wirklich löschen?</strong></p>
-          <p class="sg-body sg-delete-confirmation-pattern__text">Du kannst das nicht rückgängig machen. Bestätige durch Eingabe von <span class="sg-delete-confirmation-pattern__code">DELETE</span>.</p>
-          <label class="sg-labeled-input-row sg-delete-confirmation-pattern__input-row">
-            <span class="sg-label">Bestätigung</span>
-            <input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="text" placeholder="DELETE" aria-label="Löschbestätigung durch DELETE" data-vsf-delete-confirmation-input>
-          </label>
-          <div class="sg-delete-confirmation-pattern__actions">
-            <button class="sg-interaction-element sg-button sg-button--active" type="button" data-overlay-dialog-close>Abbrechen</button>
-            <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive" type="button" disabled aria-disabled="true" data-vsf-delete-confirmation-submit>
-              Löschen
-            </button>
-          </div>
-        </div>
-      </article>
-    </div>
-
-      <article class="sg-card sg-object-card" data-pattern="object-group-card" aria-label="Neue Liste anlegen Karte">
-        <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="object-group-card-header">
-          <div class="sg-strong">Neue Liste anlegen</div>
-        </header>
-        <div class="sg-card-segment sg-card-segment--gray sg-object-card__content" data-pattern-part="object-group-card-content">
-          <div class="sg-form-sections-card-wrapper" data-pattern="form-sections" aria-label="Formular mit Abschnitten">
-            <form class="sg-form-sections-card" action="#" method="post" aria-label="Neue Liste anlegen Formular">
-              <div class="sg-form-sections-card__body" data-pattern-part="form-body">
-                <section class="sg-form-sections-card__chapter" aria-label="Neue Liste">
-                  <div class="sg-form-sections-card__field-group">
-                    <label class="sg-labeled-input-row">
-                      <span class="sg-label">Listentyp</span>
-                      <div class="sg-pulldown-demo" data-open="false" data-align="left" data-selection-mode="single" data-component="pulldown" data-component-context="form" data-component-state="inactive-selectable">
-                        <button class="sg-interaction-element sg-pulldown sg-pulldown--inactive-selectable sg-form-inactive-selectable sg-pulldown-demo__trigger" type="button" aria-expanded="false" aria-label="Pulldown ohne aktive Auswahl" data-component-part="pulldown-trigger" data-label-base="Listentyp">
-                          Listentyp
-                        </button>
-                        <div class="sg-pulldown-panel" aria-label="Geoeffnetes Pulldown Listentyp" data-component-part="pulldown-panel">
-                          <ul class="sg-pulldown-option-list" aria-label="Listentyp Optionen">
-                            <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Watchlist</span></li>
-                            <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Portfolio</span></li>
-                            <li class="sg-pulldown-option" role="checkbox" aria-checked="false" data-pulldown-option><span>Screening</span></li>
-                          </ul>
-                        </div>
-                      </div>
-                    </label>
-
-                    <label class="sg-labeled-input-row">
-                      <span class="sg-label">Name</span>
-                      <input
-                        class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable"
-                        type="text"
-                        placeholder="Name eingeben"
-                        aria-label="Name"
-                        maxlength="80"
-                      >
-                    </label>
-
-                    <label class="sg-labeled-input-row">
-                      <span class="sg-label">Beschreibung</span>
-                      <textarea
-                        class="sg-input-multi-line sg-form-inactive-selectable"
-                        rows="4"
-                        placeholder="Beschreibung eingeben"
-                        aria-label="Beschreibung"
-                        maxlength="350"
-                      ></textarea>
-                    </label>
-                  </div>
-                </section>
-              </div>
-
-              <footer class="sg-form-sections-card__actions-segment" data-pattern-part="form-actions-segment">
-                <div class="sg-form-sections-card__actions" data-pattern-part="form-actions">
-                  <button class="sg-interaction-element sg-button sg-button--active sg-form-sections-card__action" type="button">Zuruecksetzen</button>
-                  <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive sg-form-sections-card__action" type="submit" disabled aria-disabled="true">Liste anlegen</button>
-                </div>
-              </footer>
-            </form>
-          </div>
-        </div>
-      </article>
-    </div>
-
-
-  </section>
-
-  <script>
-    const formCard = document.querySelector('#layout-vsf-list-card .sg-object-card-grid:first-of-type .sg-form-sections-card');
-    const processButton = formCard?.querySelector('.sg-button--process');
-
-    const updateProcessButtonState = () => {
-      if (!formCard || !processButton) {
-        return;
-      }
-
-      const hasPulldownSelection = Array.from(formCard.querySelectorAll('[data-pulldown-option]'))
-        .some((option) => option.getAttribute('aria-checked') === 'true');
-      const hasTextInput = Array.from(formCard.querySelectorAll('input[type="text"], textarea'))
-        .some((field) => field.value.trim().length > 0);
-      const isActive = hasPulldownSelection || hasTextInput;
-
-      processButton.disabled = !isActive;
-      processButton.setAttribute('aria-disabled', String(!isActive));
-      processButton.classList.toggle('sg-button--process-inactive', !isActive);
-    };
-
-    const updatePulldownSelectionState = (demo) => {
-      const trigger = demo.querySelector('.sg-pulldown-demo__trigger');
-      const selectableOptions = demo.querySelectorAll('[data-pulldown-option]');
-
-      if (!trigger || selectableOptions.length === 0) {
-        return;
-      }
-
-      const selectedCount = Array.from(selectableOptions).filter((option) => {
-        return option.getAttribute('aria-checked') === 'true';
-      }).length;
-      const labelBase = trigger.dataset.labelBase || 'Auswahl';
-
-      trigger.textContent = selectedCount > 0 ? `${labelBase} (${selectedCount})` : labelBase;
-      trigger.classList.toggle('sg-pulldown--selected', selectedCount > 0);
-      trigger.classList.toggle('sg-form-active', selectedCount > 0);
-      trigger.dataset.componentState = selectedCount > 0 ? 'selected' : 'inactive-selectable';
-      demo.dataset.componentState = selectedCount > 0 ? 'selected' : 'inactive-selectable';
-      updateProcessButtonState();
-    };
-
-    document.querySelectorAll('.sg-pulldown-demo').forEach((demo) => {
-      const trigger = demo.querySelector('.sg-pulldown-demo__trigger');
-      if (!trigger) {
-        return;
-      }
-
-      trigger.addEventListener('click', (event) => {
-        event.stopPropagation();
-        const nextState = demo.dataset.open !== 'true';
-
-        document.querySelectorAll('.sg-pulldown-demo').forEach((otherDemo) => {
-          const otherTrigger = otherDemo.querySelector('.sg-pulldown-demo__trigger');
-          otherDemo.dataset.open = 'false';
-          if (otherTrigger) {
-            otherTrigger.setAttribute('aria-expanded', 'false');
-          }
-        });
-
-        demo.dataset.open = String(nextState);
-        trigger.setAttribute('aria-expanded', String(nextState));
-      });
-    });
-
-    document.querySelectorAll('.sg-pulldown-option[data-pulldown-option]').forEach((option) => {
-      option.addEventListener('click', (event) => {
-        event.stopPropagation();
-        const pulldownDemo = option.closest('.sg-pulldown-demo');
-        if (!pulldownDemo) {
-          return;
-        }
-
-        pulldownDemo.querySelectorAll('[data-pulldown-option]').forEach((otherOption) => {
-          otherOption.setAttribute('aria-checked', String(otherOption === option));
-        });
-
-        updatePulldownSelectionState(pulldownDemo);
-        const trigger = pulldownDemo.querySelector('.sg-pulldown-demo__trigger');
-        pulldownDemo.dataset.open = 'false';
-        if (trigger) {
-          trigger.setAttribute('aria-expanded', 'false');
-        }
-      });
-    });
-
-    document.querySelectorAll('.sg-pulldown-demo').forEach(updatePulldownSelectionState);
-    formCard?.querySelectorAll('input[type="text"], textarea').forEach((field) => {
-      field.addEventListener('input', updateProcessButtonState);
-    });
-    updateProcessButtonState();
-
-    const editInputs = document.querySelectorAll('[data-vsf-edit-input]');
-    const editSaveButton = document.querySelector('[data-vsf-edit-save]');
-    const deleteDialogInput = document.querySelector('[data-vsf-delete-confirmation-input]');
-    const deleteDialogSubmitButton = document.querySelector('[data-vsf-delete-confirmation-submit]');
-
-    if (editInputs.length > 0 && editSaveButton) {
-      const updateEditSaveState = () => {
-        const hasInput = Array.from(editInputs).some((field) => field.value.trim().length > 0);
-        editSaveButton.disabled = !hasInput;
-        editSaveButton.setAttribute('aria-disabled', String(!hasInput));
-        editSaveButton.classList.toggle('sg-button--process-inactive', !hasInput);
-      };
-
-      editInputs.forEach((field) => {
-        field.addEventListener('input', updateEditSaveState);
-      });
-      updateEditSaveState();
-    }
-
-    if (deleteDialogInput && deleteDialogSubmitButton) {
-      const updateDeleteDialogState = () => {
-        const isValid = deleteDialogInput.value === 'DELETE';
-        deleteDialogSubmitButton.disabled = !isValid;
-        deleteDialogSubmitButton.setAttribute('aria-disabled', String(!isValid));
-        deleteDialogSubmitButton.classList.toggle('sg-button--process-inactive', !isValid);
-      };
-
-      deleteDialogInput.addEventListener('input', updateDeleteDialogState);
-      updateDeleteDialogState();
-    }
-
-    const closeStageDialogs = (stage) => {
-      stage.querySelectorAll('.sg-delete-confirmation-pattern__floating-card').forEach((dialog) => {
-        dialog.hidden = true;
-      });
-      stage.dataset.dialogOpen = 'false';
-    };
-
-    document.querySelectorAll('.sg-delete-confirmation-pattern__stage').forEach((stage) => {
-      closeStageDialogs(stage);
-    });
-
-    document.querySelectorAll('[data-overlay-open-dialog]').forEach((link) => {
-      link.addEventListener('click', (event) => {
-        event.preventDefault();
-        event.stopPropagation();
-
-        const stage = link.closest('.sg-delete-confirmation-pattern__stage');
-        if (!stage) {
-          return;
-        }
-
-        const target = link.getAttribute('data-overlay-open-dialog');
-        const dialog = stage.querySelector(`.sg-delete-confirmation-pattern__floating-card[data-overlay-dialog="${target}"]`);
-
-        if (!dialog) {
-          return;
-        }
-
-        closeStageDialogs(stage);
-        dialog.hidden = false;
-        stage.dataset.dialogOpen = 'true';
-
-        const menuWrap = link.closest('.sg-sandwich-menu-wrap');
-        const menuButton = menuWrap?.querySelector('.sg-sandwich-button');
-        if (menuWrap) {
-          menuWrap.dataset.open = 'false';
-        }
-        if (menuButton) {
-          menuButton.setAttribute('aria-expanded', 'false');
-        }
-      });
-    });
-
-    document.querySelectorAll('[data-overlay-dialog-close], [data-vsf-delete-confirmation-submit], [data-vsf-edit-save]').forEach((button) => {
-      button.addEventListener('click', (event) => {
-        event.preventDefault();
-        const stage = button.closest('.sg-delete-confirmation-pattern__stage');
-        if (!stage) {
-          return;
-        }
-        closeStageDialogs(stage);
-      });
-    });
-
-    document.querySelectorAll('.sg-sandwich-menu-wrap').forEach((wrap) => {
-      const button = wrap.querySelector('.sg-sandwich-button');
-      const panel = wrap.querySelector('.sg-sandwich-menu-panel');
-
-      if (!button) {
-        return;
-      }
-
-      button.addEventListener('click', (event) => {
-        event.stopPropagation();
-        const nextState = wrap.dataset.open !== 'true';
-
-        document.querySelectorAll('.sg-sandwich-menu-wrap').forEach((otherWrap) => {
-          const otherButton = otherWrap.querySelector('.sg-sandwich-button');
-          otherWrap.dataset.open = 'false';
-          if (otherButton) {
-            otherButton.setAttribute('aria-expanded', 'false');
-          }
-        });
-
-        wrap.dataset.open = String(nextState);
-        button.setAttribute('aria-expanded', String(nextState));
-
-        if (!nextState || !panel) {
-          return;
-        }
-
-        wrap.dataset.align = 'right';
-        const panelRect = panel.getBoundingClientRect();
-        if (panelRect.left < 0) {
-          wrap.dataset.align = 'left';
-        }
-      });
-    });
-
-    document.addEventListener('click', (event) => {
-      if (event.target.closest('.sg-pulldown-demo') || event.target.closest('.sg-sandwich-menu-wrap')) {
-        return;
-      }
-
-      document.querySelectorAll('.sg-pulldown-demo').forEach((demo) => {
-        const trigger = demo.querySelector('.sg-pulldown-demo__trigger');
-        demo.dataset.open = 'false';
-        if (trigger) {
-          trigger.setAttribute('aria-expanded', 'false');
-        }
-      });
-
-      document.querySelectorAll('.sg-sandwich-menu-wrap').forEach((wrap) => {
-        const button = wrap.querySelector('.sg-sandwich-button');
-        wrap.dataset.open = 'false';
-        if (button) {
-          button.setAttribute('aria-expanded', 'false');
-        }
-      });
-    });
-  </script>
-
-</body>
-</html>
