I have the following html file that callas a data to be displayed on LWC. hOWEVER, i need it to display as attached. How can i modify my html in order to display the header every 3-4 rows?

<template>
   
		<div class="slds-text-heading--large">All Training Modules</div><br/>
		<table class="slds-table slds-table_cell-buffer slds-table_bordered">
			<thead>
				<tr class="slds-line-height_reset">
					<th class="slds-text-title_caps" scope="col" >
						<div class="slds-truncate" title="Product">Products</div>
					</th>
					<th class="slds-text-title_caps" scope="col">
						<div class="slds-truncate" title="Release">Release</div>
					</th>
					<th class="slds-text-title_caps" scope="col">
						<div class="slds-truncate" title="Length">Length</div>
					</th>
					<th class="slds-text-title_caps" scope="col">
						<div class="slds-truncate" title="Description">Description</div>
					</th>
				</tr>
			</thead>
				<tbody>
                     <template  for:each={trainingModuleList} for:item="list">
                     <tr key={list.Id} class="slds-hint-parent">
                     <td data-label="title" class="slds-cell-wrap">
                        <p>
                            <lightning-formatted-url value={list.Download_Link__c}  label={list.Title__c} ></lightning-formatted-url>
                        </p>
                    </td>
                  <td data-label="title" class="slds-cell-wrap">
                        <p>{list.release}</p>
                    </td>
                    <td data-label="title" class="slds-cell-wrap">
                        <p>{list.Length__c}</p>
                    </td>
                         <td data-label="title" class="slds-cell-wrap">
                        <p> {list.Description__c} </p>
                   
                    
                    </td>

                </tr>
            </template>
        </tbody>
    </table>
</template>