feat(motion): add scroll reveals and micro-interactions

src/components/EducationSection.tsx

@@ -7,7 +7,7 @@ export const EducationSection: React.FC = () => {
   return (
     <section id="education" className={styles.educationSection}>
       <div className="content-container">
-        <div className="section-header">
+        <div className="section-header" data-reveal="soft">
           <div className="section-title-wrap">
             <h2 className="section-title">Where I Built the Foundation</h2>
             <div className="section-underline" />
@@ -15,8 +15,8 @@ export const EducationSection: React.FC = () => {
         </div>
 
         {/* Degree Card */}
-        <div className={styles.card}>
-          <div className={styles.crestCol}>
+        <div className={styles.card} data-reveal-group>
+          <div className={styles.crestCol} data-reveal="image">
             <div className={styles.crestContainer}>
               <Image
                 src={education.logo}
@@ -28,7 +28,7 @@ export const EducationSection: React.FC = () => {
             </div>
           </div>
 
-          <div className={styles.detailsCol}>
+          <div className={styles.detailsCol} data-reveal="soft">
             <h3 className={styles.degreeTitle}>{education.degree}</h3>
             <div className={styles.institution}>{education.institution}</div>
             <div className={styles.date}>{education.date}</div>