feat(SW-252): change semantic element

components/HotelReservation/HotelCard/index.tsx

@@ -27,7 +27,7 @@ export default async function HotelCard({ hotel }: HotelCardProps) {
 
   return (
     <article className={styles.card}>
-      <div className={styles.imageContainer}>
+      <section className={styles.imageContainer}>
         <Image
           src={hotel.hotelContent.images.imageSizes.large}
           alt={hotel.hotelContent.images.metaData.altText}
@@ -41,8 +41,8 @@ export default async function HotelCard({ hotel }: HotelCardProps) {
             {hotel.ratings?.tripAdvisor.rating}
           </Chip>
         </div>
-      </div>
-      <header className={styles.header}>
+      </section>
+      <section className={styles.hotelInformation}>
         <ScandicLogoIcon color="red" />
         <Title as="h4" textTransform="capitalize">
           {hotel.name}
@@ -53,7 +53,7 @@ export default async function HotelCard({ hotel }: HotelCardProps) {
         <Footnote color="textMediumContrast">
           {`${hotel.location.distanceToCentre} ${intl.formatMessage({ id: "km to city center" })}`}
         </Footnote>
-      </header>
+      </section>
       <section className={styles.hotel}>
         <div className={styles.facilities}>
           {sortedAmenities.map((facility) => {