diff --git a/patterns/vsf-card-listen-fundamentalanalyse-drawer.html b/patterns/vsf-card-listen-fundamentalanalyse-drawer.html
index fc0e61d..c44ba67 100644
--- a/patterns/vsf-card-listen-fundamentalanalyse-drawer.html
+++ b/patterns/vsf-card-listen-fundamentalanalyse-drawer.html
@@ -57,8 +57,8 @@
         <button id="vsf-business-model-toggle" class="sg-interaction-element sg-button" type="button" aria-controls="vsf-business-model-text" aria-expanded="false">Geschäftsmodell anzeigen</button>
       </footer>
     </article>
-    <article class="sg-card sg-card--content-card sg-vsf-drawer-controls-card" data-component="content-card" aria-label="Fundamentalanalyse Steuerung">
-      <div class="sg-card-segment sg-card-segment--body sg-card-segment--gray sg-vsf-drawer-controls-row" data-component-part="card-body">
+    <article class="sg-card sg-card--content-card sg-card--overlay-host sg-inline-controls-card" data-component="content-card" aria-label="Fundamentalanalyse Steuerung">
+      <div class="sg-card-segment sg-card-segment--body sg-card-segment--gray sg-inline-controls-row" data-component-part="card-body">
         <button class="sg-mode-toggle" type="button" data-active="relative" aria-label="Modus Schieber global: relativ aktiv" data-component="mode-toggle" data-component-context="drawer-controls">
           <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">
@@ -82,8 +82,8 @@
         </div>
       </div>
     </article>
-    <div class="sg-transparent-card sg-vsf-fundamental-analysis-intro" data-component="transparent-card">
-      <h2 class="sg-heading-h2 sg-vsf-fundamental-analysis-heading">Fundamentalanalyse vom 12.5.2026</h2>
+    <div class="sg-transparent-card sg-analysis-intro-block" data-component="transparent-card">
+      <h2 class="sg-heading-h2 sg-text-on-dark">Fundamentalanalyse vom 12.5.2026</h2>
       <p class="sg-body sg-text-layout-pattern__sample sg-text-layout-pattern__sample--full-width" data-pattern-part="text-block-full-width">
         Nächste Quartalszahlen/Fundamentalanalyse: nicht bekannt
       </p>
@@ -104,7 +104,7 @@
       <div class="sg-content-block-card-group__panels">
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-1" role="tabpanel" aria-labelledby="vsf-fundamental-tab-1">
           <div class="sg-content-cards-group" data-pattern="content-cards-group" aria-label="Card Gruppe Gesamtbewertung">
-            <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Gesamtbewertung">
+            <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Gesamtbewertung">
               <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Gesamtbewertung <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--gray" data-component-part="card-body">
                 <div class="sg-score-bar-list sg-score-bar-list--single-score" data-component="score-bar-list">
@@ -133,7 +133,7 @@
                 </p>
               </div>
             </article>
-            <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Unterschied zur letzten Analyse vom 1.5.2026">
+            <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Unterschied zur letzten Analyse vom 1.5.2026">
               <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Unterschied zur letzten Analyse vom 1.5.2026 <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--body" data-component-part="card-body">
                 <p class="sg-body">Die Investment-Story hat sich insgesamt verbessert, da sich die strukturellen Wachstumstreiber konkretisiert und die Profitabilität deutlich beschleunigt hat.</p>
@@ -144,7 +144,7 @@
           </div>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-2" role="tabpanel" aria-labelledby="vsf-fundamental-tab-2" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Marktbewertung">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Marktbewertung">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Marktbewertung <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--gray" data-component-part="card-body">
               <div class="sg-score-bar-list sg-score-bar-list--single-score" data-component="score-bar-list">
@@ -192,7 +192,7 @@
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-3" role="tabpanel" aria-labelledby="vsf-fundamental-tab-3" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Wachstum">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Wachstum">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Wachstum <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--gray" data-component-part="card-body">
               <div class="sg-score-bar-list sg-score-bar-list--single-score" data-component="score-bar-list">
@@ -237,7 +237,7 @@
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-4" role="tabpanel" aria-labelledby="vsf-fundamental-tab-4" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Profitabilität">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Profitabilität">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Profitabilität <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--gray" data-component-part="card-body">
               <div class="sg-score-bar-list sg-score-bar-list--single-score" data-component="score-bar-list">
@@ -282,7 +282,7 @@
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-5" role="tabpanel" aria-labelledby="vsf-fundamental-tab-5" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Stabilität">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Stabilität">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Stabilität <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--gray" data-component-part="card-body">
               <div class="sg-score-bar-list sg-score-bar-list--single-score" data-component="score-bar-list">
@@ -327,7 +327,7 @@
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-6" role="tabpanel" aria-labelledby="vsf-fundamental-tab-6" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="TAM">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="TAM">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">TAM <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--body" data-component-part="card-body">
               <p class="sg-body">Der Gesamtmarkt für Datenspeicher wird bis zum Jahr 2030 auf rund 200 Milliarden Dollar geschätzt. Dieses Wachstum wird durch exponentiell steigende Datenmengen angetrieben, wobei Technologien wie Cloud-Computing und das Training künstlicher Intelligenz zentrale Treiber mit hohen jährlichen Zuwachsraten sind. Western Digital adressiert primär den NAND-Flash-Markt, in dem es mit einem Marktanteil von 15 bis 18 Prozent hinter dem Marktführer liegt.</p>
@@ -336,19 +336,19 @@
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-7" role="tabpanel" aria-labelledby="vsf-fundamental-tab-7" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Zyklus">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Zyklus">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Zyklus <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--body" data-component-part="card-body"><p class="sg-body">Inhalt Zyklus.</p></div>
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-8" role="tabpanel" aria-labelledby="vsf-fundamental-tab-8" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Moat">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Moat">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Moat <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--body" data-component-part="card-body"><p class="sg-body">Inhalt Moat.</p></div>
           </article>
         </div>
         <div class="sg-content-block-card-group__panel" id="vsf-fundamental-tab-panel-9" role="tabpanel" aria-labelledby="vsf-fundamental-tab-9" hidden>
-          <article class="sg-card sg-card--content-card" data-component="content-card" aria-label="Technologie">
+          <article class="sg-card sg-card--content-card sg-card--overlay-host" data-component="content-card" aria-label="Technologie">
             <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header"><div class="sg-strong">Technologie <span class="sg-help-icon-wrap" data-open="false" data-align="left" data-component="help-icon"><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-card-segment sg-card-segment--body" data-component-part="card-body"><p class="sg-body">Inhalt Technologie.</p></div>
           </article>
diff --git a/semantic-tokens-components.html b/semantic-tokens-components.html
index 32799c2..0f95d8d 100644
--- a/semantic-tokens-components.html
+++ b/semantic-tokens-components.html
@@ -39,6 +39,7 @@
         <tr><td>layout-card-body-text-margin</td><td>0</td><td>Textabstand im Card-Body; verhindert zusätzliche Default-Margins.</td></tr>
       </tbody>
     </table>
+    <p class="sg-table-label">Verhaltensregel: Für Cards mit ausklappenden Overlays (z. B. Help-Panel, Sandwich-Menü, Pulldown) ist die Komponenten-Variante <code>sg-card--overlay-host</code> zu verwenden, damit Overlays nicht abgeschnitten werden.</p>
 
     <h3 class="sg-sub-heading sg-section-h3">Group Card</h3>
     <table class="sg-foundation-table sg-table-label">
diff --git a/styleguide.css b/styleguide.css
index 6d4178b..760c780 100644
--- a/styleguide.css
+++ b/styleguide.css
@@ -2139,11 +2139,11 @@ section + section {
   color: var(--text-portal-header-tab);
 }
 
-.sg-vsf-drawer-controls-card {
+.sg-inline-controls-card {
   --surface-card-body: var(--surface-card-segment-neutral);
 }
 
-.sg-card-segment.sg-vsf-drawer-controls-row {
+.sg-card-segment.sg-inline-controls-row {
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
@@ -2156,21 +2156,17 @@ section + section {
   margin: 0;
 }
 
-.sg-vsf-fundamental-analysis-heading {
-  color: var(--text-vsf-drawer-object-card-body);
-}
-
-.sg-vsf-fundamental-analysis-intro {
+.sg-analysis-intro-block {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-small);
 }
 
-.sg-vsf-fundamental-analysis-intro .sg-heading-h2 {
+.sg-analysis-intro-block .sg-heading-h2 {
   margin: 0;
 }
 
-.sg-vsf-fundamental-analysis-intro .sg-text-layout-pattern__sample {
+.sg-analysis-intro-block .sg-text-layout-pattern__sample {
   margin: 0;
   color: var(--text-vsf-drawer-object-card-body);
 }
@@ -2284,7 +2280,7 @@ section + section {
   --layout-card-body-text-margin: 0;
   display: flex;
   flex-direction: column;
-  overflow: visible;
+  overflow: hidden;
   width: 100%;
   box-sizing: border-box;
   border: var(--border-none);
@@ -2293,6 +2289,10 @@ section + section {
   background: var(--surface-card);
 }
 
+.sg-card.sg-card--overlay-host {
+  overflow: visible;
+}
+
 .sg-card > .sg-card-segment:first-child {
   border-top-left-radius: var(--radius-card);
   border-top-right-radius: var(--radius-card);