Feat: Refine UI and consolidate components

- Updated the heading in the Pastel page from 'Color Playground' to 'Pastel'.
- Adjusted the logo size in the Hero component for better visual balance.
- Removed duplicate/unused Footer components from pastel layout and ui directories.

components/units/converter/MainConverter.tsx

@@ -148,8 +148,10 @@ export default function MainConverter() {
           <CardTitle>Convert {formatMeasureName(selectedMeasure)}</CardTitle>
         </CardHeader>
         <CardContent className="space-y-6 pt-0">
-          <div className="flex gap-2 items-end">
-            <div className="flex-1">
+          {/* Input row, stacks vertically on mobile, horizontal on desktop */}
+          <div className="flex flex-col gap-4 md:flex-row md:items-end md:gap-2">
+            {/* Value Input */}
+            <div className="flex-1 w-full">
               <label className="text-sm font-medium mb-2 block">Value</label>
               <Input
                 type="text"
@@ -157,10 +159,11 @@ export default function MainConverter() {
                 value={inputValue}
                 onChange={(e) => setInputValue(e.target.value)}
                 placeholder="Enter value"
-                className="text-lg"
+                className={cn("text-lg", "w-full", "max-w-full")}
               />
             </div>
-            <div className="w-40">
+            {/* From Unit Select */}
+            <div className="w-full md:w-40">
               <label className="text-sm font-medium mb-2 block">From</label>
               <Select
                 value={selectedUnit}
@@ -173,16 +176,18 @@ export default function MainConverter() {
                 ))}
               </Select>
             </div>
+            {/* Swap Button */}
             <Button
               variant="outline"
               size="icon"
               onClick={handleSwapUnits}
-              className="flex-shrink-0"
+              className="flex-shrink-0 w-full md:w-40" // Make button full width on mobile too
               title="Swap units"
             >
               <ArrowLeftRight className="h-4 w-4" />
             </Button>
-            <div className="w-40">
+            {/* To Unit Select */}
+            <div className="w-full md:w-40">
               <label className="text-sm font-medium mb-2 block">To</label>
               <Select
                 value={targetUnit}