bug: (ion-segment): screen readers fail to announce correct tab count/position due to ARIA tablist hierarchy

### Prerequisites

- [x] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
- [x] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [x] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v8.x

### Current Behavior

`ion-segment` elements do not correctly announce tab counts or position (e.g., announcing "1 of 1" or just "tab" instead of "1 of n") when using screen readers such as VoiceOver (iOS/macOS) and TalkBack (Android).

Per the [W3C ARIA Authoring Practices Guide (APG) Tabs Pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/), elements with `role="tab"` must be directly contained by or owned by an element with `role="tablist"`.

In the current Shadow DOM / DOM hierarchy of `ion-segment`, intermediate elements sit between the `role="tablist"` container (`ion-segment`) and the individual `role="tab"` buttons (`ion-segment-button`). Because of this broken parent-child ARIA relationship, assistive technologies fail to calculate the set size and position in set automatically.

### Expected Behavior

The screen reader should announce the current tab's position relative to the total number of tabs in the segment list (e.g., *"Tab 1 of 4"*, *"Tab 2 of 4"*).

### Steps to Reproduce

1. Enable VoiceOver (macOS/iOS) or TalkBack (Android).
2. Navigate to the official Ionic documentation page: https://ionicframework.com/docs/api/segment
3. Focus on any `ion-segment` example containing multiple `ion-segment-button` elements.
4. Listen to the screen reader output when navigating between tabs.

### Code Reproduction URL

https://github.com/marlon-ionic/issue-a11y-announce-segment

### Ionic Info

Ionic:

```
Ionic CLI : 7.2.1 (/Users/user.name/.local/share/fnm/node-versions/v24.11.1/installation/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 8.8.14
@angular-devkit/build-angular : 20.3.28
@angular-devkit/schematics : 20.3.32
@angular/cli : 20.3.28
@ionic/angular-toolkit : 12.3.0
```

Capacitor:

```
Capacitor CLI : 8.4.2
@capacitor/android : 8.4.2
@capacitor/core : 8.4.2
@capacitor/ios : 8.4.2
```

Utility:

```
cordova-res : not installed globally
native-run : 2.0.3
```

System:

```
NodeJS : v24.11.1 (/Users/user.name/.local/share/fnm/node-versions/v24.11.1/installation/bin/node)
npm : 11.16.0
OS : macOS Unknown
```

### Additional Information

### Suggested Fix

* **Option A:** Adjust the internal rendering structure so `role="tab"` elements are direct children of the `role="tablist"` container.
* **Option B:** Utilize `aria-owns` on the `role="tablist"` element pointing to the IDs of the `role="tab"` elements, or explicitly provide `aria-setsize` and `aria-posinset` attributes on each `ion-segment-button`.

### Related Resources

* [W3C ARIA Tab Pattern Guidelines](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/)
* [Rocket Validator: Element with role="tab" must be contained in or owned by role="tablist"](https://rocketvalidator.com/html-validation/an-element-with-role-tab-must-be-contained-in-or-owned-by-an-element-with-role-tablist)

Start with the ion-segment and ion-segment-button implementation and compare their rendered hierarchy with the W3C ARIA Tabs Pattern. Reproduce the issue using the linked accessibility demo or the ion-segment documentation examples with VoiceOver or TalkBack. Done means each segment button is correctly contained or owned by the tablist and screen readers announce its position and total count, such as “Tab 1 of 4”.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.