diff --git a/packages/react/src/components/error-summary/error-summary.test.tsx.snap b/packages/react/src/components/error-summary/error-summary.test.tsx.snap
index 71ea09d423..f108cc1455 100644
--- a/packages/react/src/components/error-summary/error-summary.test.tsx.snap
+++ b/packages/react/src/components/error-summary/error-summary.test.tsx.snap
@@ -38,6 +38,14 @@ exports[`ErrorSummary matches the snapshot 1`] = `
   outline-offset: -2px;
 }
 
+.c4 {
+  color: #1B1C1E;
+  font-size: 1rem;
+  font-weight: var(--font-semi-bold);
+  line-height: 1.5rem;
+  margin: 0;
+}
+
 .c2 {
   grid-area: icon;
   margin-top: var(--spacing-half);
@@ -80,7 +88,7 @@ exports[`ErrorSummary matches the snapshot 1`] = `
 
 .c5 {
   font-size: 0.875rem;
-  margin: var(--spacing-half) 0 0 0;
+  margin: 0;
 }
 
 .c3 {
@@ -89,13 +97,6 @@ exports[`ErrorSummary matches the snapshot 1`] = `
   margin-left: var(--spacing-1halfx);
 }
 
-.c4 {
-  font-size: 1rem;
-  font-weight: var(--font-semi-bold);
-  line-height: 1.5;
-  margin: 0;
-}
-
 .c6 {
   font-size: 0.875rem;
   margin: var(--spacing-1x) 0 0 0;
@@ -116,12 +117,8 @@ exports[`ErrorSummary matches the snapshot 1`] = `
   margin-bottom: var(--spacing-1x);
 }
 
-<section
-  aria-atomic="true"
-  aria-labelledby="uuid1"
-  aria-live="assertive"
+<div
   class="c0"
-  role="alert"
   tabindex="-1"
 >
   <svg
@@ -175,5 +172,5 @@ exports[`ErrorSummary matches the snapshot 1`] = `
       </ul>
     </div>
   </div>
-</section>
+</div>
 `;
diff --git a/packages/react/src/components/sectional-banner/sectional-banner.test.tsx b/packages/react/src/components/sectional-banner/sectional-banner.test.tsx
index b524f4a798..d23a6d143f 100644
--- a/packages/react/src/components/sectional-banner/sectional-banner.test.tsx
+++ b/packages/react/src/components/sectional-banner/sectional-banner.test.tsx
@@ -1,4 +1,4 @@
-import { findByTestId, getByTestId } from '../../test-utils/enzyme-selectors';
+import { getByTestId } from '../../test-utils/enzyme-selectors';
 import { mountWithProviders, renderWithProviders } from '../../test-utils/renderer';
 import { DeviceType } from '../device-context-provider/device-context-provider';
 import { SectionalBanner } from './sectional-banner';
@@ -43,22 +43,6 @@ describe('SectionalBanner', () => {
     });
 
     (['mobile', 'desktop'] as DeviceType[]).forEach((device) => {
-        it(`should not show dismiss button when type is alert (${device})`, () => {
-            const wrapper = mountWithProviders(
-                <SectionalBanner
-                    type="alert"
-                    onDismiss={jest.fn()}
-                >
-                    Test
-                </SectionalBanner>,
-                { wrappingComponentProps: { staticDevice: device } },
-            );
-
-            const dismissButton = findByTestId(wrapper, 'dismiss-button');
-
-            expect(dismissButton.exists()).toBe(false);
-        });
-
         it(`should show destructive button when type is alert (${device})`, () => {
             const wrapper = mountWithProviders(
                 <SectionalBanner
@@ -91,7 +75,7 @@ describe('SectionalBanner', () => {
 
             getByTestId(wrapper, 'dismiss-button').simulate('click');
 
-            expect(onDismiss).toBeCalled();
+            expect(onDismiss).toHaveBeenCalled();
         });
 
         it(`should call callback when button is clicked (${device})`, () => {
@@ -109,7 +93,7 @@ describe('SectionalBanner', () => {
 
             getByTestId(wrapper, `${device}-button`).simulate('click');
 
-            expect(onButtonClicked).toBeCalled();
+            expect(onButtonClicked).toHaveBeenCalled();
         });
     });
 });
diff --git a/packages/react/src/components/sectional-banner/sectional-banner.test.tsx.snap b/packages/react/src/components/sectional-banner/sectional-banner.test.tsx.snap
index ebc02566ac..e5b1dd1b09 100644
--- a/packages/react/src/components/sectional-banner/sectional-banner.test.tsx.snap
+++ b/packages/react/src/components/sectional-banner/sectional-banner.test.tsx.snap
@@ -41,9 +41,9 @@ exports[`SectionalBanner should match snapshot (custom message) 1`] = `
   width: 1rem;
 }
 
-.c5 {
+.c4 {
   font-size: 0.875rem;
-  margin: var(--spacing-half) 0 0 0;
+  margin: 0;
 }
 
 .c3 {
@@ -52,19 +52,8 @@ exports[`SectionalBanner should match snapshot (custom message) 1`] = `
   margin-left: var(--spacing-1halfx);
 }
 
-.c4 {
-  font-size: 1rem;
-  font-weight: var(--font-semi-bold);
-  line-height: 1.5;
-  margin: 0;
-}
-
-<section
-  aria-atomic="true"
-  aria-labelledby="uuid1"
-  aria-live="polite"
+<div
   class="c0"
-  role="status"
 >
   <svg
     aria-hidden="true"
@@ -77,14 +66,8 @@ exports[`SectionalBanner should match snapshot (custom message) 1`] = `
   <div
     class="c3"
   >
-    <span
-      class="c4"
-      id="uuid1"
-    >
-      Information
-    </span>
     <div
-      class="c5"
+      class="c4"
     >
       <p>
         Some sub title
@@ -96,7 +79,7 @@ exports[`SectionalBanner should match snapshot (custom message) 1`] = `
       </ul>
     </div>
   </div>
-</section>
+</div>
 `;
 
 exports[`SectionalBanner should match snapshot (desktop) 1`] = `
@@ -140,9 +123,9 @@ exports[`SectionalBanner should match snapshot (desktop) 1`] = `
   width: 1rem;
 }
 
-.c5 {
+.c4 {
   font-size: 0.875rem;
-  margin: var(--spacing-half) 0 0 0;
+  margin: 0;
 }
 
 .c3 {
@@ -151,19 +134,8 @@ exports[`SectionalBanner should match snapshot (desktop) 1`] = `
   margin-left: var(--spacing-1halfx);
 }
 
-.c4 {
-  font-size: 1rem;
-  font-weight: var(--font-semi-bold);
-  line-height: 1.5;
-  margin: 0;
-}
-
-<section
-  aria-atomic="true"
-  aria-labelledby="uuid1"
-  aria-live="polite"
+<div
   class="c0"
-  role="status"
 >
   <svg
     aria-hidden="true"
@@ -176,19 +148,13 @@ exports[`SectionalBanner should match snapshot (desktop) 1`] = `
   <div
     class="c3"
   >
-    <span
-      class="c4"
-      id="uuid1"
-    >
-      Information
-    </span>
     <p
-      class="c5"
+      class="c4"
     >
       Test
     </p>
   </div>
-</section>
+</div>
 `;
 
 exports[`SectionalBanner should match snapshot (mobile) 1`] = `
@@ -231,9 +197,9 @@ exports[`SectionalBanner should match snapshot (mobile) 1`] = `
   width: 1rem;
 }
 
-.c5 {
+.c4 {
   font-size: 1rem;
-  margin: var(--spacing-2x) 0 0 0;
+  margin: 0;
 }
 
 .c3 {
@@ -242,19 +208,8 @@ exports[`SectionalBanner should match snapshot (mobile) 1`] = `
   margin-left: var(--spacing-1halfx);
 }
 
-.c4 {
-  font-size: 1.125rem;
-  font-weight: var(--font-semi-bold);
-  line-height: 1.7;
-  margin: 0;
-}
-
-<section
-  aria-atomic="true"
-  aria-labelledby="uuid1"
-  aria-live="polite"
+<div
   class="c0"
-  role="status"
 >
   <svg
     aria-hidden="true"
@@ -267,17 +222,11 @@ exports[`SectionalBanner should match snapshot (mobile) 1`] = `
   <div
     class="c3"
   >
-    <span
-      class="c4"
-      id="uuid1"
-    >
-      Information
-    </span>
     <p
-      class="c5"
+      class="c4"
     >
       Test
     </p>
   </div>
-</section>
+</div>
 `;
diff --git a/packages/react/src/components/sectional-banner/sectional-banner.tsx b/packages/react/src/components/sectional-banner/sectional-banner.tsx
index e91ffff536..f08a142f23 100644
--- a/packages/react/src/components/sectional-banner/sectional-banner.tsx
+++ b/packages/react/src/components/sectional-banner/sectional-banner.tsx
@@ -8,6 +8,7 @@ import {
     VoidFunctionComponent,
 } from 'react';
 import styled, { css, ThemedCssFunction } from 'styled-components';
+import { Heading, Tag } from '../heading/heading';
 import { useId } from '../../hooks/use-id';
 import { useTranslation } from '../../i18n/use-translation';
 import { ResolvedTheme } from '../../themes/theme';
@@ -19,13 +20,9 @@ import { Icon, IconName } from '../icon/icon';
 
 type MobileDeviceContext = { $isMobile: boolean };
 export type SectionalBannerType = 'neutral' | 'info' | 'discovery' | 'success' | 'warning' | 'alert';
-type Role = 'status' | 'alert';
-type Live = 'polite' | 'assertive';
-type HeadingTag = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';
 
 interface AbstractContainerProps extends MobileDeviceContext {
     className?: string;
-    role: Role;
     tabIndex?: number;
 }
 
@@ -58,7 +55,7 @@ function abstractContainer(
     borderColor: keyof ResolvedTheme['component'],
     iconColor: keyof ResolvedTheme['component'],
 ): FunctionComponent<PropsWithChildren<AbstractContainerProps>> {
-    return styled.section<AbstractContainerProps>`
+    return styled.div<AbstractContainerProps>`
         background-color: ${(props) => props.theme.component[bgColor]};
         border: 1px solid ${(props) => props.theme.component[borderColor]};
         border-radius: var(--border-radius-2x);
@@ -114,7 +111,7 @@ const AlertContainer = abstractContainer(
 
 const Message = styled.p<MobileDeviceContext>`
     font-size: ${(props) => (props.$isMobile ? '1rem' : '0.875rem')};
-    margin: ${(props) => (props.$isMobile ? 'var(--spacing-2x)' : 'var(--spacing-half)')} 0 0 0;
+    margin: 0;
 `;
 
 const TextWrapper = styled.div<MobileDeviceContext>`
@@ -133,20 +130,12 @@ function getDismissButtonTop({ $marginTop }: DismissButtonProps): string {
     return `calc(var(--spacing-2x) - ${2 * $marginTop}px)`;
 }
 
-const DismissIconButton = styled(IconButton)
-    .attrs({ buttonType: 'tertiary', iconName: 'x' }) <DismissButtonProps>`
+const DismissIconButton = styled(IconButton) <DismissButtonProps>`
     position: absolute;
     right: ${getDismissButtonRight};
     top: ${getDismissButtonTop};
 `;
 
-const Heading = styled.span<MobileDeviceContext>`
-    font-size: ${(props) => (props.$isMobile ? '1.125rem' : '1rem')};
-    font-weight: var(--font-semi-bold);
-    line-height: ${(props) => (props.$isMobile ? '1.7' : '1.5')};
-    margin: 0;
-`;
-
 const StyledActionButton = styled(Button)`
     grid-area: button;
     margin-top: var(--spacing-2x);
@@ -173,10 +162,8 @@ const ActionButton: VoidFunctionComponent<ActionButtonProps> = ({
 );
 
 interface BannerTypeProps {
-    ariaLive: Live;
     container: ComponentType<PropsWithChildren<AbstractContainerProps>>;
     iconName: IconName;
-    role: Role;
     title: 'Neutral' | 'Info' | 'Discovery' | 'Success' | 'Warning' | 'Alert';
 }
 
@@ -186,48 +173,36 @@ function handleType(type: SectionalBannerType): BannerTypeProps {
             return {
                 container: NeutralContainer,
                 iconName: 'info',
-                ariaLive: 'polite',
-                role: 'status',
                 title: 'Neutral',
             };
         case 'info':
             return {
                 container: InfoContainer,
                 iconName: 'info',
-                ariaLive: 'polite',
-                role: 'status',
                 title: 'Info',
             };
         case 'discovery':
             return {
                 container: DiscoveryContainer,
                 iconName: 'lightbulb',
-                ariaLive: 'polite',
-                role: 'status',
                 title: 'Discovery',
             };
         case 'success':
             return {
                 container: SuccessContainer,
                 iconName: 'check',
-                ariaLive: 'polite',
-                role: 'status',
                 title: 'Success',
             };
         case 'warning':
             return {
                 container: WarningContainer,
                 iconName: 'alertTriangle',
-                ariaLive: 'assertive',
-                role: 'alert',
                 title: 'Warning',
             };
         case 'alert':
             return {
                 container: AlertContainer,
                 iconName: 'alertOctagon',
-                ariaLive: 'assertive',
-                role: 'alert',
                 title: 'Alert',
             };
     }
@@ -238,8 +213,7 @@ interface SectionalBannerProps {
     className?: string;
     children: ReactNode;
     focusable?: boolean;
-    /** @default `span` */
-    headingTag?: HeadingTag;
+    headingTag?: Tag;
     id?: string;
     /** Sets custom message title */
     title?: string;
@@ -285,10 +259,6 @@ export const SectionalBanner: VoidFunctionComponent<SectionalBannerProps> = ({
             className={className}
             $isMobile={isMobile}
             tabIndex={focusable ? -1 : undefined}
-            aria-live={bannerType.ariaLive}
-            aria-atomic="true"
-            aria-labelledby={headingId}
-            role={bannerType.role}
         >
             <BannerIcon
                 name={bannerType.iconName}
@@ -298,7 +268,7 @@ export const SectionalBanner: VoidFunctionComponent<SectionalBannerProps> = ({
             />
 
             <TextWrapper $isMobile={isMobile}>
-                <Heading $isMobile={isMobile} as={headingTag} id={headingId}>{title || t(bannerType.title)}</Heading>
+                {title && <Heading tag={headingTag} id={headingId} type="small" bold noMargin>{title}</Heading>}
                 <Message $isMobile={isMobile} as={messageTag}>{children}</Message>
                 {!isMobile && buttonLabel && (
                     <ActionButton
@@ -319,8 +289,10 @@ export const SectionalBanner: VoidFunctionComponent<SectionalBannerProps> = ({
                 />
             )}
 
-            {!isAlertType && onDismiss && (
+            {onDismiss && (
                 <DismissIconButton
+                    buttonType='tertiary'
+                    iconName='x'
                     onClick={onDismiss}
                     label={t('dismissLabel')}
                     $isMobile={isMobile}
diff --git a/packages/react/src/i18n/translations.ts b/packages/react/src/i18n/translations.ts
index f0b967557f..918b983a11 100644
--- a/packages/react/src/i18n/translations.ts
+++ b/packages/react/src/i18n/translations.ts
@@ -93,12 +93,6 @@ export const Translations = {
             label: 'Search',
         },
         'sectional-banner': {
-            Alert: 'Alert',
-            Warning: 'Warning',
-            Success: 'Success',
-            Info: 'Information',
-            Discovery: 'Pro-tip',
-            Neutral: 'Information',
             dismissLabel: 'Dismiss banner',
         },
         'skip-link': {
@@ -233,12 +227,6 @@ export const Translations = {
             label: 'Rechercher',
         },
         'sectional-banner': {
-            Alert: 'Alerte',
-            Warning: 'Attention',
-            Success: 'Succès',
-            Info: 'Information',
-            Discovery: 'Truc de pro',
-            Neutral: 'Information',
             dismissLabel: 'Rejeter la bannière',
         },
         'skip-link': {
diff --git a/packages/storybook/stories/sectional-banner.stories.tsx b/packages/storybook/stories/sectional-banner.stories.tsx
index e5c6f319fa..421c5bd80e 100644
--- a/packages/storybook/stories/sectional-banner.stories.tsx
+++ b/packages/storybook/stories/sectional-banner.stories.tsx
@@ -30,6 +30,7 @@ type Story = StoryObj<typeof SectionalBanner>;
 
 export const Neutral: Story = {
     args: {
+        title: 'Neutral',
         type: 'neutral',
     },
     render: (args) => {
@@ -50,6 +51,7 @@ export const Neutral: Story = {
 
 export const Informative: Story = {
     args: {
+        title: 'Informative',
         type: 'info',
     },
     render: (args) => {
@@ -70,6 +72,7 @@ export const Informative: Story = {
 
 export const Success: Story = {
     args: {
+        title: 'Success',
         type: 'success',
     },
     render: (args) => {
@@ -90,6 +93,7 @@ export const Success: Story = {
 
 export const Warning: Story = {
     args: {
+        title: 'Warning',
         type: 'warning',
     },
     render: (args) => {
@@ -110,6 +114,7 @@ export const Warning: Story = {
 
 export const Alert: Story = {
     args: {
+        title: 'Alert',
         type: 'alert',
     },
     render: (args) => {
@@ -135,6 +140,7 @@ export const Alert: Story = {
 
 export const Discovery: Story = {
     args: {
+        title: 'Discovery',
         type: 'discovery',
     },
     render: (args) => {