diff --git a/public/assets/icons/apple.svg b/public/assets/icons/apple.svg
new file mode 100644
index 0000000..f59af6c
--- /dev/null
+++ b/public/assets/icons/apple.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M17.05 20.28c-.98.95-2.05.88-3.08.4-1.09-.5-2.08-.48-3.24 0-1.44.62-2.2.44-3.06-.4C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z"/></svg>
\ No newline at end of file
diff --git a/src/app/(auth)/login/page.tsx b/src/app/(auth)/login/page.tsx
index 574b8be..8654103 100644
--- a/src/app/(auth)/login/page.tsx
+++ b/src/app/(auth)/login/page.tsx
@@ -75,16 +75,34 @@ export default function LoginPage() {
     <>
       {/* Login Heading */}
       <div className="text-center mb-6">
-        <h2 className="text-[30px] font-normal text-[#00293d] mb-3">Login</h2>
-        <p className="text-sm text-[#00293d] px-4 leading-relaxed">
-          Sign in to your account to access your real estate dashboard and manage your properties
+        <h2 className="text-[30px] font-normal text-[#00293d] font-fractul mb-3">Login</h2>
+        <p className="text-[14px] text-[#00293d] px-4 leading-[20px] font-fractul">
+          Login or create an account to enjoy FREE consultation on all property inquiries.
         </p>
       </div>
 
+      {/* User Type Toggle */}
+      <div className="flex justify-center mb-8">
+        <div className="inline-flex bg-[#f0f5fc] rounded-[15px] p-0.5">
+          <button
+            type="button"
+            className="px-10 py-2 text-[14px] font-semibold rounded-[15px] transition-all duration-200 font-serif bg-[#00293d] text-[#f0f5fc] border border-[#00293d]"
+          >
+            User
+          </button>
+          <button
+            type="button"
+            className="px-10 py-2 text-[14px] font-semibold rounded-[15px] transition-all duration-200 font-serif text-[#00293d]"
+          >
+            Admin
+          </button>
+        </div>
+      </div>
+
       {/* Login Form */}
       <form onSubmit={handleSubmit} className="space-y-5">
         {error && (
-          <div className="bg-red-50 border border-red-200 text-red-600 px-4 py-3 rounded-[20px] text-sm">
+          <div className="bg-red-50 border border-red-200 text-red-600 px-4 py-3 rounded-[7px] text-[14px] font-serif">
             {error}
           </div>
         )}
@@ -97,7 +115,7 @@ export default function LoginPage() {
             value={email}
             onChange={(e) => setEmail(e.target.value)}
             required
-            className="w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all"
+            className="w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all"
           />
         </div>
 
@@ -109,7 +127,7 @@ export default function LoginPage() {
             value={password}
             onChange={(e) => setPassword(e.target.value)}
             required
-            className="w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all pr-14"
+            className="w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all pr-14"
           />
           <button
             type="button"
@@ -131,8 +149,8 @@ export default function LoginPage() {
 
         {/* Forgot Password Link */}
         <div className="text-right">
-          <Link href="/forgot-password" className="text-[#00293d] text-sm font-light hover:underline">
-            Forgot Password?
+          <Link href="/forgot-password" className="text-[#00293d] text-[14px] font-light font-serif leading-[24px] hover:underline">
+            Forget Your Password ?
           </Link>
         </div>
 
@@ -140,29 +158,29 @@ export default function LoginPage() {
         <button
           type="submit"
           disabled={loading}
-          className="w-full py-6 bg-[#e58625] hover:bg-[#d47a1f] text-[#00293d] font-bold text-sm rounded-[20px] transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+          className="w-full py-6 bg-[#e58625] hover:bg-[#d47a1f] text-[#00293d] font-bold text-[20px] font-fractul rounded-[7px] transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
         >
           {loading ? 'Signing in...' : 'Login'}
         </button>
       </form>
 
-      {/* Don't Have Account */}
-      <div className="text-center mt-8">
-        <span className="text-[#00293d] text-sm">Don&apos;t Have An Account ? </span>
-        <Link href="/signup" className="text-[#00293d] font-light text-sm hover:underline">
-          Sign Up
-        </Link>
-      </div>
-
       {/* Divider */}
       <div className="flex items-center my-6">
         <div className="flex-1 h-px bg-[#00293d]/20"></div>
-        <span className="px-4 text-sm text-[#00293d] font-light">Or</span>
+        <span className="px-4 text-[14px] text-[#00293d] font-serif">Or</span>
         <div className="flex-1 h-px bg-[#00293d]/20"></div>
       </div>
 
       {/* Social Login Icons */}
       <div className="flex justify-center items-center gap-8">
+        {/* Apple */}
+        <button
+          type="button"
+          className="w-10 h-10 flex items-center justify-center hover:opacity-70 transition-opacity"
+        >
+          <img src="/assets/icons/apple.svg" alt="Apple" className="w-6 h-6" />
+        </button>
+
         {/* Google */}
         <button
           type="button"
diff --git a/src/app/(auth)/signup/page.tsx b/src/app/(auth)/signup/page.tsx
index ec1b045..f77ec9a 100644
--- a/src/app/(auth)/signup/page.tsx
+++ b/src/app/(auth)/signup/page.tsx
@@ -103,13 +103,13 @@ export default function SignUpPage() {
               <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
             </svg>
           </div>
-          <h2 className="text-[24px] font-normal text-[#00293d] mb-3">Check Your Email</h2>
-          <p className="text-sm text-[#00293d]/70 mb-6">
+          <h2 className="text-[24px] font-normal text-[#00293d] font-fractul mb-3">Check Your Email</h2>
+          <p className="text-[14px] text-[#00293d]/70 font-serif mb-6">
             We've sent a verification link to <strong>{email}</strong>. Please check your inbox and click the link to verify your account before logging in.
           </p>
           <Link
             href="/login"
-            className="inline-block w-full py-4 bg-[#e58625] hover:bg-[#d47a1f] text-[#00293d] font-bold text-sm rounded-[20px] transition-colors text-center"
+            className="inline-block w-full py-4 bg-[#e58625] hover:bg-[#d47a1f] text-[#00293d] font-bold text-[14px] font-fractul rounded-[7px] transition-colors text-center"
           >
             Go to Login
           </Link>
@@ -125,21 +125,21 @@ export default function SignUpPage() {
     <>
       {/* Sign Up Heading */}
       <div className="text-center mb-6">
-        <h2 className="text-[30px] font-normal text-[#00293d] mb-3">Sign Up</h2>
-        <p className="text-sm text-[#00293d] px-4 leading-relaxed">
+        <h2 className="text-[30px] font-normal text-[#00293d] font-fractul mb-3">Sign Up</h2>
+        <p className="text-[14px] text-[#00293d] px-4 leading-[20px] font-fractul">
           Sign in or create an account to showcase your skills & expertise to millions of people starting their real estate journey today"
         </p>
       </div>
 
       {/* User Type Toggle */}
       <div className="flex justify-center mb-8">
-        <div className="inline-flex bg-[#f0f5fc] rounded-[20px] p-0.5">
+        <div className="inline-flex bg-[#f0f5fc] rounded-[15px] p-0.5">
           <button
             type="button"
             onClick={() => setUserType('USER')}
-            className={`px-7 py-2 text-sm font-light rounded-[20px] transition-all duration-200 ${
+            className={`px-10 py-2 text-[14px] font-medium rounded-[15px] transition-all duration-200 font-serif ${
               userType === 'USER'
-                ? 'bg-[#00293d] text-[#f0f5fc]'
+                ? 'bg-[#00293d] text-[#f0f5fc] border border-[#00293d]'
                 : 'text-[#00293d]'
             }`}
           >
@@ -148,9 +148,9 @@ export default function SignUpPage() {
           <button
             type="button"
             onClick={() => setUserType('AGENT')}
-            className={`px-7 py-2 text-sm font-light rounded-[20px] transition-all duration-200 ${
+            className={`px-10 py-2 text-[14px] font-medium rounded-[15px] transition-all duration-200 font-serif ${
               userType === 'AGENT'
-                ? 'bg-[#00293d] text-[#f0f5fc]'
+                ? 'bg-[#00293d] text-[#f0f5fc] border border-[#00293d]'
                 : 'text-[#00293d]'
             }`}
           >
@@ -162,7 +162,7 @@ export default function SignUpPage() {
       {/* Sign Up Form */}
       <form onSubmit={handleSubmit} className="space-y-5">
         {error && (
-          <div className="bg-red-50 border border-red-200 text-red-600 px-4 py-3 rounded-[20px] text-sm">
+          <div className="bg-red-50 border border-red-200 text-red-600 px-4 py-3 rounded-[7px] text-[14px] font-serif">
             {error}
           </div>
         )}
@@ -176,7 +176,7 @@ export default function SignUpPage() {
               value={firstName}
               onChange={(e) => setFirstName(e.target.value)}
               required
-              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all ${
+              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all ${
                 getFieldError('firstName') ? 'ring-2 ring-red-400' : ''
               }`}
             />
@@ -190,7 +190,7 @@ export default function SignUpPage() {
               placeholder="Last Name"
               value={lastName}
               onChange={(e) => setLastName(e.target.value)}
-              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all ${
+              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all ${
                 getFieldError('lastName') ? 'ring-2 ring-red-400' : ''
               }`}
             />
@@ -208,7 +208,7 @@ export default function SignUpPage() {
             value={email}
             onChange={(e) => setEmail(e.target.value)}
             required
-            className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all ${
+            className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all ${
               getFieldError('email') ? 'ring-2 ring-red-400' : ''
             }`}
           />
@@ -226,7 +226,7 @@ export default function SignUpPage() {
               value={password}
               onChange={(e) => setPassword(e.target.value)}
               required
-              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all pr-14 ${
+              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif placeholder:text-[#00293d] focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all pr-14 ${
                 getFieldError('password') ? 'ring-2 ring-red-400' : ''
               }`}
             />
@@ -250,7 +250,7 @@ export default function SignUpPage() {
           {getFieldError('password') && (
             <p className="text-red-500 text-xs mt-1 ml-2">{getFieldError('password')}</p>
           )}
-          <p className="text-[#00293d]/60 text-xs mt-2 ml-2">
+          <p className="text-[#00293d]/60 text-xs mt-2 ml-2 font-serif">
             Min 8 chars, 1 uppercase, 1 lowercase, 1 number, 1 special character
           </p>
         </div>
@@ -263,7 +263,7 @@ export default function SignUpPage() {
               onChange={(e) => setSelectedAgentTypeId(e.target.value)}
               required
               disabled={loadingAgentTypes}
-              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[20px] text-[#00293d] text-sm font-light focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all appearance-none cursor-pointer ${
+              className={`w-full px-6 py-6 bg-[#f0f5fc] rounded-[7px] text-[#00293d] text-[14px] font-light font-serif focus:outline-none focus:ring-2 focus:ring-[#00293d]/20 transition-all appearance-none cursor-pointer ${
                 !selectedAgentTypeId ? 'text-[#00293d]/60' : ''
               } ${getFieldError('agentTypeId') ? 'ring-2 ring-red-400' : ''}`}
               style={{
@@ -290,7 +290,7 @@ export default function SignUpPage() {
         <button
           type="submit"
           disabled={loading}
-          className="w-full py-6 bg-[#e58625] hover:bg-[#d47a1f] text-[#00293d] font-bold text-sm rounded-[20px] transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+          className="w-full py-6 bg-[#e58625] hover:bg-[#d47a1f] text-[#00293d] font-bold text-[20px] font-fractul rounded-[7px] transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
         >
           {loading ? 'Creating Account...' : 'Sign Up'}
         </button>
@@ -298,8 +298,8 @@ export default function SignUpPage() {
 
       {/* Already Have Account */}
       <div className="text-center mt-8">
-        <span className="text-[#00293d] text-sm">Already Have An Account ? </span>
-        <Link href="/login" className="text-[#00293d] font-light text-sm hover:underline">
+        <span className="text-[#00293d] text-[14px] font-serif">Already Have An Account ? </span>
+        <Link href="/login" className="text-[#00293d] font-bold text-[14px] font-fractul hover:underline">
           Login
         </Link>
       </div>
@@ -307,12 +307,20 @@ export default function SignUpPage() {
       {/* Divider */}
       <div className="flex items-center my-6">
         <div className="flex-1 h-px bg-[#00293d]/20"></div>
-        <span className="px-4 text-sm text-[#00293d] font-light">Or</span>
+        <span className="px-4 text-[14px] text-[#00293d] font-serif">Or</span>
         <div className="flex-1 h-px bg-[#00293d]/20"></div>
       </div>
 
       {/* Social Login Icons */}
       <div className="flex justify-center items-center gap-8">
+        {/* Apple */}
+        <button
+          type="button"
+          className="w-10 h-10 flex items-center justify-center hover:opacity-70 transition-opacity"
+        >
+          <img src="/assets/icons/apple.svg" alt="Apple" className="w-6 h-6" />
+        </button>
+
         {/* Google */}
         <button
           type="button"