feat: add accessible required field indicators and alerts

- Add visual asterisk for required inputs in Input.tsx
- Add .required style in Input.module.css
- Update Contact form to use required props and noValidate
- Add role="alert" to Contact form success/error messages
- Add tests for required field rendering

Co-authored-by: ragusa-it <196988693+ragusa-it@users.noreply.github.com>

src/pages/Contact.tsx

@@ -158,9 +158,14 @@ export function Contact() {
             >
               <p className={styles.intro}>{t.contact.intro}</p>
 
-              <form onSubmit={handleSubmit} className={styles.form}>
+              <form
+                onSubmit={handleSubmit}
+                className={styles.form}
+                noValidate
+              >
                 <Input
                   label={t.contact.form.name}
+                  required
                   placeholder={t.contact.form.namePlaceholder}
                   value={formData.name}
                   onChange={(e) => handleChange("name", e.target.value)}
@@ -170,6 +175,7 @@ export function Contact() {
                 <Input
                   label={t.contact.form.email}
                   type="email"
+                  required
                   placeholder={t.contact.form.emailPlaceholder}
                   value={formData.email}
                   onChange={(e) => handleChange("email", e.target.value)}
@@ -178,6 +184,7 @@ export function Contact() {
 
                 <Input
                   label={t.contact.form.subject}
+                  required
                   placeholder={t.contact.form.subjectPlaceholder}
                   value={formData.subject}
                   onChange={(e) => handleChange("subject", e.target.value)}
@@ -186,6 +193,7 @@ export function Contact() {
 
                 <Textarea
                   label={t.contact.form.message}
+                  required
                   placeholder={t.contact.form.messagePlaceholder}
                   value={formData.message}
                   onChange={(e) => handleChange("message", e.target.value)}
@@ -210,6 +218,8 @@ export function Contact() {
                     className={styles.success}
                     initial={{ opacity: 0, y: 10 }}
                     animate={{ opacity: 1, y: 0 }}
+                    role="alert"
+                    aria-live="polite"
                   >
                     {t.contact.form.success}
                   </motion.p>
@@ -220,6 +230,8 @@ export function Contact() {
                     className={styles.error}
                     initial={{ opacity: 0, y: 10 }}
                     animate={{ opacity: 1, y: 0 }}
+                    role="alert"
+                    aria-live="polite"
                   >
                     {t.contact.form.error}
                   </motion.p>