feat: Add SCSS mixins and variables for animation design tokens (#1116)

[Sweksha-Kakkar]

Changes Made

Closes #1116

Problem:

CSS bundle size was growing due to repetitive hardcoded values (cubic-bezier curves, durations, delays) written explicitly in every utility class.

Solution:

Created a new scss/ folder with reusable SCSS design tokens:

New Files:

• scss/_variables.scss — Central animation tokens:

  • 12 easing curves (linear, cubic, quart, bounce, elastic)
  • 5 duration tokens (100ms → 1000ms)
  • 4 delay tokens
  • Fill mode constants

• scss/_mixins.scss — Reusable animation mixins:

  • animate() — base animation mixin
  • transition() — transition shorthand
  • fade-in(), fade-out()
  • slide-in-up(), slide-in-down()
  • scale-in(), scale-out()
  • bounce(), pulse()

• scss/_index.scss — Single entry point for all SCSS imports

Benefits:

• Eliminates repetitive hardcoded cubic-bezier values
• DRY architecture for future animation additions
• Easy to extend with new easing tokens

Checklist

• I have read the CONTRIBUTING.md
• My code follows the style guidelines of this project
• I have tested my changes locally
• This PR is linked to an issue
• I have added a proper description of my changes

[Sweksha-Kakkar]

@SAPTARSHI-coder
Please look into this and merge it I have raised the PR.