Fix/8839 toc anchor mobile issue (#12305)

### Related Ticket(s)

Closes https://jsw.ibm.com/browse/ADCMS-8839

### Description

In mobile, the ToC was not working properly. Specifically the Next Steps band.

The Next Steps band has a different HTML structure and the ToC was not accounting for it, resulting in the "next steps" button when clicked, to scroll to the top of the page instead of the actual Next Steps band

As for now, this is reproducible in any live page:
https://www.ibm.com/products/cloud-pak-for-data/resources



### Changelog

Slightly changed the way we calculate the scroll position, to account for any HTML structure.

https://github.com/user-attachments/assets/bb994088-b558-4ad3-b03d-547aaedf983e

Author: bruno-amorim

packages/web-components/src/components/table-of-contents/table-of-contents.ts

@@ -436,11 +436,14 @@ class C4DTableOfContents extends MediaQueryMixin(
       const currentY = window.scrollY;
       let targetY;
 
-      if (currentY > elem.offsetTop && masthead) {
-        targetY = elem.offsetTop - masthead.offsetHeight;
+      const rect = elem.getBoundingClientRect();
+      const offset = rect.top + currentY;
+
+      if (currentY > offset && masthead) {
+        targetY = offset - masthead.offsetHeight;
       } else {
         targetY =
-          elem.offsetTop -
+          offset -
           parseInt(
             window.getComputedStyle(elem).getPropertyValue('padding-top')
           ) -