diff --git a/components/cards-public-page.html b/components/cards-public-page.html
index 9e8410c..40c4c99 100644
--- a/components/cards-public-page.html
+++ b/components/cards-public-page.html
@@ -8,7 +8,7 @@
 </head>
 <body class="sg-page-cards-public-page">
 
-  <h1 class="sg-main-heading">Component: CTA Right</h1>
+  <h1 class="sg-main-heading">Components – Cards Public Page</h1>
 
   <main aria-label="Cards Public Page">
 
@@ -20,23 +20,27 @@
           Content Wrapper Card als Transparent Card ohne horizontale Außenabstände und mit vertikalem Abstand gemäss spacing-large.
         </p>
 
-        <article class="sg-card sg-card--content-card sg-card--content-card-dark sg-cards-public-page__cta-right-card" data-component="content-card" aria-label="CTA Right">
-          <div class="sg-card-segment sg-card-segment--body sg-cards-public-page__cta-right-body">
-            <div class="sg-cards-public-page__cta-right-grid">
-              <div class="sg-cards-public-page__cta-right-copy">
-                <p class="sg-body">
-                  Ein Satz Text als CTA-Hinweis.
-                </p>
-              </div>
+        <section id="component-cta-right">
+          <p class="sg-preview-label">Component: CTA Right</p>
 
-              <div class="sg-cards-public-page__cta-right-buttons" data-component="link-buttons">
-                <button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active">
-                  Link-Button
-                </button>
+          <article class="sg-card sg-card--content-card sg-card--content-card-dark sg-cards-public-page__cta-right-card" data-component="content-card" aria-label="CTA Right">
+            <div class="sg-card-segment sg-card-segment--body sg-cards-public-page__cta-right-body">
+              <div class="sg-cards-public-page__cta-right-grid">
+                <div class="sg-cards-public-page__cta-right-copy">
+                  <p class="sg-body">
+                    Ein Satz Text als CTA-Hinweis.
+                  </p>
+                </div>
+
+                <div class="sg-cards-public-page__cta-right-buttons" data-component="link-buttons">
+                  <button class="sg-interaction-element sg-button sg-button--active" type="button" data-component="button" data-component-state="active">
+                    Link-Button
+                  </button>
+                </div>
               </div>
             </div>
-          </div>
-        </article>
+          </article>
+        </section>
       </div>
     </section>
 
diff --git a/styles/40-components-cards.css b/styles/40-components-cards.css
index 8ecf081..fb2e3c9 100644
--- a/styles/40-components-cards.css
+++ b/styles/40-components-cards.css
@@ -230,12 +230,23 @@
   margin: 0 0 var(--spacing-large) 0;
 }
 
+.sg-page-cards-public-page {
+  overflow-x: hidden;
+}
+
 .sg-page-cards .sg-preview-area > .sg-card,
 .sg-page-cards .sg-preview-area > .sg-transparent-card {
   width: 100%;
   max-width: none;
 }
 
+.sg-page-cards-public-page #component-content-wrapper-card {
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+  padding-inline: var(--spacing-small);
+}
+
 .sg-page-cards-public-page #component-content-wrapper-card > .sg-transparent-card {
   width: 100%;
   max-width: none;
@@ -245,7 +256,6 @@
 .sg-page-cards-public-page .sg-cards-public-page__cta-right-card {
   width: var(--layout-public-content-element-width);
   max-width: none;
-  margin-top: var(--spacing-large);
   margin-inline-start: auto;
 }
 
