update contact & FAQ loop compossent

frontend/src/components/Pages/Contact.jsx

@@ -156,7 +156,7 @@ const Contact = () => {
       >
         <Box>
           <Typography
-            variant="h2"
+            variant="h1"
             sx={{
               fontWeight: "bold",
               fontSize: { xs: "2rem", md: "3rem", lg: "4rem" },
@@ -166,13 +166,16 @@ const Contact = () => {
             Contactez-nous
           </Typography>
           <Typography
-            variant="h6"
+            variant="body2"
             sx={{
-              fontSize: { xs: "1rem", md: "1.5rem" },
+              fontSize: { xs: "1rem", md: "1rem" },
               maxWidth: "600px",
               mx: "auto",
             }}
           >
+            Notre bureau d’étude technique est, par essence, spécialisé. 
+            Vous pouvez donc faire appel à nous pour un diagnostic ponctuel portant sur tel ou tel équipement ou ouvrage du bâtiment 
+            (structures, chaufferie, ascenseur).<br></br> <br></br>
             Une question ? Une demande particulière ? Remplissez le formulaire
             ci-dessous ou consultez nos coordonnées.
           </Typography>
@@ -182,6 +185,7 @@ const Contact = () => {
       {/* Section Coordonnées et Horaires */}
       <Box sx={{ padding: "40px 20px", backgroundColor: "#f9f9f9" }}>
         <Grid container spacing={4}>
+
           {/* Coordonnées */}
           <Grid item xs={12} md={6}>
             <Card
@@ -197,8 +201,9 @@ const Contact = () => {
             >
               <Box>
                 <Typography
-                  variant="h4"
+                  variant="h2"
                   sx={{
+                    fontSize: { xs: "2rem", md: "2rem", lg: "3rem" },
                     fontWeight: "bold",
                     color: "#0e467f",
                     mb: 2,
@@ -206,6 +211,7 @@ const Contact = () => {
                 >
                   Nos coordonnées
                 </Typography>
+
                 <Typography variant="body1">
                   <strong>Adresse :</strong>67 Bd Winston Churchill, Le Mans,
                   France
@@ -217,6 +223,7 @@ const Contact = () => {
                   <strong>Email :</strong> contact@be-in3.com
                 </Typography>
               </Box>
+
               <Box
                 onClick={handleOpenLightbox}
                 sx={{
@@ -268,8 +275,9 @@ const Contact = () => {
             >
               <CardContent>
                 <Typography
-                  variant="h4"
+                  variant="h2"
                   sx={{
+                    fontSize: { xs: "2rem", md: "2rem", lg: "3rem" },
                     fontWeight: "bold",
                     color: "#0e467f",
                     mb: 2,
@@ -278,6 +286,7 @@ const Contact = () => {
                 >
                   Horaires d'ouverture
                 </Typography>
+
                 <Typography variant="body1">
                   <strong>Lundi - Mardi :</strong> 9h00 - 16h00
                 </Typography>
@@ -342,8 +351,9 @@ const Contact = () => {
         }}
       >
         <Typography
-          variant="h4"
+          variant="h2"
           sx={{
+            fontSize: { xs: "2rem", md: "2rem", lg: "3rem" }, // Responsive
             fontWeight: "bold",
             mb: 2,
             fontSize: { xs: "1.5rem", md: "2rem" },
@@ -381,7 +391,7 @@ const Contact = () => {
         }}
       >
         <Typography
-          variant="h4"
+          variant="h2"
           sx={{
             mb: 4,
             textAlign: "center",