diff --git a/script.js b/script.js
index cb0169c..3fc17a1 100644
--- a/script.js
+++ b/script.js
@@ -1,4 +1,4 @@
-
+document.addEventListener('DOMContentLoaded',function(){
 var form1= document.getElementById("form1");
 var form2= document.getElementById("form2");
 var form3= document.getElementById("form3");
@@ -6,75 +6,152 @@ var Next1= document.getElementById("Next1");
 var Next2= document.getElementById("Next2");
 var Back1= document.getElementById("Back1");
 var Back2= document.getElementById("Back2");
-
+var submitBtn = document.getElementById("Submit");
+var successMessage= document.getElementById("successMessage");
+var clearFormBtn = document.getElementById("clearForm");
+var jsonPreview = document.getElementById('jsonPreview');
 var progress= document.getElementById("progress");
-var clearFormBtn = document.getElementById('clearForm');
-const form = document.getElementsByClassName("multi-step-form");
 
 var formData = {
     personalDetails:{},
     professionalDetails:{},
+};
+
+//Validations
+function validateFullName(){
+    var fullName = document.getElementById('fullName');
+    var errorMsg = document.getElementById('fullName-error');
+    if( fullName.value.trim() === ''){
+        errorMsg.textContent = 'Full Name is required.';
+        return false;
+    }
+    if(fullName.value.length < 3){
+        errorMsg.textContent = "Full Name must be at least 3 characters long.";
+        return false;
+    }
+    var regex = /^[A-Za-z\s]+$/;
+    if(!regex.test(fullName.value)){
+        errorMsg.textContent = "Full Name must contain letters only.";
+        return false;
+    }
+
+    errorMsg.textContent = '';
+    return true;
 }
 
-//For Validation
-// const fields= {
-//     fullName: document.getElementById("fullName"),
-//     email: document.getElementById("email"),
-//     phone: document.getElementById("phone"),
-//     age: document.getElementById('age'),
-//     gender: form.querySelector('[name="gender"]'),
-//     education: document.getElementById("education"),
-//     skills: form.querySelectorAll("[name='skills']"),
-//     experience: document.getElementById("experience"),
-//     currentRole: document.getElementById("currentRole")
-  
-// };
-
-
-// const reviewSection = document.getElementById('reviewSection');
-// //save Personal Details
-// const saveToLocalStorage =()=>{
-//  const formData = getFormData();
-//  localStorage.setItem("formData",JSON.stringify(formData));
-// };
-// const getFormData= () =>{
-//     const formData ={
-//         personal:{
-//             fullName: fields.fullName.value,
-//             email: fields.email.value,
-//             phone: fields.phone.value,
-//             age: fields.age.value,
-//             gender: fields.gender.value
-
-//         },
-//         professional:{
-//             education: fields.education.value,
-//             skills: Array.from(fields.skills).filter(skills => skills.checked).map(skills => skills.value),
-//             experience: fields.experience.value,
-//             currentRole: fields.currentRole.value
-//         }
-//     }
-// };
-// //Display Review Section
-// function displayReviewSection(){
+function validateEmail(){
+    var email = document.getElementById('email');
+    var errorMsg = document.getElementById('email-error');
+    var regex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
+    if(email.value.trim()=== ''){
+        errorMsg.textContent= 'Email is required.';
+        return false;
+    }else if(!regex.test(email.value)){
+        errorMsg.textContent = 'Please enter valid email address';
+        return false;
+    }
+    errorMsg.textContent ='';
+    return true;
     
+}
 
-//     reviewSection.innerHTML = `
-//     <h4>Personal Details</h4>
-//     <p><strong>Full Name: </strong>${personalDetails.fullName}</p>
-//     <p><strong>Email: </strong> ${personalDetails.email}</p>
-//     <p><strong>Mobile No.: </strong> ${personalDetails.phone}</p>
-//     <p><strong>Age: </strong> ${personalDetails.age}</p>
-//     <p><strong>Gender: </strong> ${personalDetails.gender}</p>
+function validatePhone(){
+    var phone = document.getElementById('phone');
+    var errorMsg = document.getElementById('phone-error');
+    var regex = /^\d{10}$/;
+    if(phone.value.trim() === ''){
+        errorMsg.textContent = 'Phone number is required.';
+        return false;
+    }else if(!regex.test(phone.value)){
+        errorMsg.textContent = 'Please enter a valid 10-digit phone number.';
+        return false;
+    }
+    errorMsg.textContent = '';
+    return true;
 
-//     `
-// };
+}
+
+function validateAge(){
+    var age = document.getElementById('age');
+    var errorMsg = document.getElementById('age-error');
+    if(age.value.trim() === ''){
+        errorMsg.textContent = 'Age is required.';
+        return false;
+    }else if( age.value < 18 || age.value > 100){
+        errorMsg.textContent = 'Age must be between 18 and 100.';
+        return false;
+    }
+    errorMsg.textContent = '';
+    return true;
+}
+
+function validateGender() {
+    var gender = document.querySelector('input[name="gender"]:checked');
+    var errorMsg = document.getElementById('gender-error');
+    if (!gender) {
+      errorMsg.textContent = 'Please select a gender.';
+      return false;
+    }
+    errorMsg.textContent = '';
+    return true;
+  }
+
+ 
+  function validateEducation() {
+    var education = document.getElementById('education');
+    var errorMsg = document.getElementById('education-error');
+    if (education.value === '') {
+      errorMsg.textContent = 'Education is required.';
+      return false;
+    }
+    errorMsg.textContent = '';
+    return true;
+  }
+
+    
+  function validateSkills() {
+    var errorMsg = document.getElementById('skills-error');
+    var checkedSkills = document.querySelectorAll('input[name="skills"]:checked');
+    if (checkedSkills.length === 0) {
+      errorMsg.textContent = 'Please select at least one skill.';
+      return false;
+    }
+    errorMsg.textContent = '';
+    return true;
+  }
+
+  function validateExperience() {
+    var experience = document.getElementById('experience');
+    var errorMsg = document.getElementById('experience-error');
+    if (experience.value.trim() === '') {
+      errorMsg.textContent = 'Experience is required.';
+      return false;
+    } else if (experience.value < 0 || experience.value > 50) {
+      errorMsg.textContent = 'Experience must be between 0 and 50 years.';
+      return false;
+    }
+    errorMsg.textContent = '';
+    return true;
+  }
+
+  function validateRole() {
+    var role = document.getElementById('currentRole');
+    var errorMsg = document.getElementById('currentRole-error');
+    if (role.value.trim() === '') {
+      errorMsg.textContent = 'Current role is required.';
+      return false;
+    }
+    errorMsg.textContent = '';
+    return true;
+  }
 
 Next1.onclick = function() {
+    if(validateFullName() && validateEmail() && validatePhone() && validateAge() && validateGender()){
     form1.style.transform = "translateX(-450px)";  
     form2.style.transform = "translateX(0px)";  
     progress.style.width = "240px";
     savePersonalDetails();
+    }
 };
 
 Back1.onclick = function() {
@@ -84,11 +161,13 @@ Back1.onclick = function() {
 };
 
 Next2.onclick = function() {
+    if(validateEducation() && validateSkills() && validateExperience() && validateRole()){
     form2.style.transform = "translateX(-450px)";  
     form3.style.transform = "translateX(0px)";  
     progress.style.width = "360px";
-    savePersonalDetails();
-    displayReviewSection();
+    saveProfessionalDetails();
+        displayReviewSection();
+    }
 };
 
 Back2.onclick = function() {
@@ -97,6 +176,96 @@ Back2.onclick = function() {
     progress.style.width = "240px";
 };
 
+//Saving data
+function savePersonalDetails(){
+    formData.personalDetails.fullName = document.getElementById('fullName').value;
+    formData.personalDetails.email = document.getElementById('email').value;
+    formData.personalDetails.phone = document.getElementById('phone').value;
+    formData.personalDetails.age = document.getElementById('age').value;
+    formData.personalDetails.gender = document.querySelector('input[name="gender"]:checked').value;
+    localStorage.setItem('personalDetails',JSON.stringify(formData.personalDetails));
+}
+
+function saveProfessionalDetails() {
+    formData.professionalDetails.education = document.getElementById('education').value;
+    formData.professionalDetails.skills = [];
+    document.querySelectorAll('input[name="skills"]:checked').forEach(function (checkbox) {
+      formData.professionalDetails.skills.push(checkbox.value);
+    });
+    formData.professionalDetails.experience = document.getElementById('experience').value;
+    formData.professionalDetails.currentRole = document.getElementById('currentRole').value;  
+    localStorage.setItem('professionalDetails', JSON.stringify(formData.professionalDetails));
+}
 
 
 
+// Display Review Section 
+function displayReviewSection() {
+    var personalDetails = JSON.parse(localStorage.getItem('personalDetails'));
+    var professionalDetails = JSON.parse(localStorage.getItem('professionalDetails'));
+
+    console.log('Personal Details:', personalDetails);
+    console.log('Professional Details:', professionalDetails);
+
+    var reviewSection = document.getElementById('reviewSection');
+    reviewSection.innerHTML = `
+    <div class = "review-section">
+    <div class="detail-group">
+      <h4>Personal Details</h4>
+      <p><strong>Full Name:</strong> ${personalDetails.fullName}</p>
+      <p><strong>Email:</strong> ${personalDetails.email}</p>
+      <p><strong>Phone:</strong> ${personalDetails.phone}</p>
+      <p><strong>Age:</strong> ${personalDetails.age}</p>
+      <p><strong>Gender:</strong> ${personalDetails.gender}</p>
+ 
+      <h4>Professional Details</h4>
+      <p><strong>Education:</strong> ${professionalDetails.education}</p>
+      <p><strong>Skills:</strong> ${professionalDetails.skills.join(', ')}</p>
+      <p><strong>Experience:</strong> ${professionalDetails.experience} years</p>
+     <p><strong>Current Role:</strong> ${professionalDetails.currentRole}</p>
+     </div>
+     </div>
+    `;
+    
+    jsonPreview.textContent = JSON.stringify({ personalDetails, professionalDetails }, null, 2);
+    submitBtn.disabled = false;
+}
+
+//Submit form success-message
+submitBtn.onclick = function (event){
+    event.preventDefault();
+    successMessage.style.display= 'block';
+    setTimeout(function(){
+        successMessage.style.display ='none';
+    },3000);
+
+    setTimeout(function() {
+        form1.reset();
+        form2.reset();
+        form3.reset();
+        localStorage.clear();
+    }, 3000);  
+}
+
+
+//Export JSOn function
+document.getElementById("exportData").onclick = function() {
+    var jsonData = jsonPreview.textContent;  
+  
+    var blob = new Blob([jsonData], { type: "application/json" });
+    var link = document.createElement("a");
+    link.href = URL.createObjectURL(blob);
+    link.download = "formData.json";  
+    link.click();
+};
+
+//Clear Form
+clearFormBtn.onclick = function () {
+    localStorage.removeItem('personalDetails');
+    localStorage.removeItem('professionalDetails');
+    window.location.reload(); 
+  };
+
+});
+
+