diff --git a/apps/console/src/pages/iam/auth/AuthLayout.tsx b/apps/console/src/pages/iam/auth/AuthLayout.tsx
index f2b398ed3..0ebdd732b 100644
--- a/apps/console/src/pages/iam/auth/AuthLayout.tsx
+++ b/apps/console/src/pages/iam/auth/AuthLayout.tsx
@@ -1,23 +1,17 @@
-import { Logo } from "@probo/ui";
+import { Card, Logo } from "@probo/ui";
 import { Outlet } from "react-router";
 
 import { IAMRelayProvider } from "#/providers/IAMRelayProvider";
 
 export default function AuthLayout() {
   return (
-    <div className="grid grid-cols-1 lg:grid-cols-2 min-h-screen text-txt-primary">
-      <div className="bg-level-0 flex flex-col items-center justify-center">
-        <div className="w-full max-w-md px-6">
-          <IAMRelayProvider>
-            <Outlet />
-          </IAMRelayProvider>
-        </div>
-      </div>
-      <div className="hidden lg:flex bg-dialog font-bold flex-col items-center justify-center p-8 text-txt-primary lg:p-10">
-        <div className="flex flex-col items-center justify-center gap-4">
-          <Logo withPicto className="w-[440px]" />
-        </div>
-      </div>
+    <div className="min-h-screen text-txt-primary bg-level-0 flex flex-col items-center justify-center">
+      <Card className="w-full max-w-lg px-12 py-8 flex flex-col items-center justify-center gap-8">
+        <Logo withPicto className="w-[110px]" />
+        <IAMRelayProvider>
+          <Outlet />
+        </IAMRelayProvider>
+      </Card>
     </div>
   );
 }
diff --git a/apps/console/src/pages/iam/auth/ForgotPasswordPage.tsx b/apps/console/src/pages/iam/auth/ForgotPasswordPage.tsx
index 4105d1ccc..17b066083 100644
--- a/apps/console/src/pages/iam/auth/ForgotPasswordPage.tsx
+++ b/apps/console/src/pages/iam/auth/ForgotPasswordPage.tsx
@@ -135,7 +135,7 @@ export default function ForgotPasswordPage() {
 
             <Button
               type="submit"
-              className="w-full"
+              className="w-xs h-10 mx-auto mt-6"
               disabled={formState.isSubmitting}
             >
               {formState.isSubmitting
diff --git a/apps/console/src/pages/iam/auth/ResetPasswordPage.tsx b/apps/console/src/pages/iam/auth/ResetPasswordPage.tsx
index 6fd968c53..aa4f2d47d 100644
--- a/apps/console/src/pages/iam/auth/ResetPasswordPage.tsx
+++ b/apps/console/src/pages/iam/auth/ResetPasswordPage.tsx
@@ -122,7 +122,7 @@ export default function ResetPasswordPage() {
           error={formState.errors.confirmPassword?.message}
         />
 
-        <Button type="submit" className="w-full" disabled={formState.isLoading}>
+        <Button type="submit" className="w-xs h-10 mx-auto mt-6" disabled={formState.isLoading}>
           {formState.isLoading
             ? __("Resetting password...")
             : __("Reset password")}
diff --git a/apps/console/src/pages/iam/auth/VerifyEmailPage.tsx b/apps/console/src/pages/iam/auth/VerifyEmailPage.tsx
index 3c7c567d8..e76f06487 100644
--- a/apps/console/src/pages/iam/auth/VerifyEmailPage.tsx
+++ b/apps/console/src/pages/iam/auth/VerifyEmailPage.tsx
@@ -111,7 +111,7 @@ export default function VerifyEmailPage() {
 
               <Button
                 type="submit"
-                className="w-full"
+                className="w-xs h-10 mx-auto mt-6"
                 disabled={form.formState.isSubmitting}
               >
                 {form.formState.isSubmitting
diff --git a/apps/console/src/pages/iam/auth/sign-in/PasswordSignInPage.tsx b/apps/console/src/pages/iam/auth/sign-in/PasswordSignInPage.tsx
index 53176043f..8e23c1186 100644
--- a/apps/console/src/pages/iam/auth/sign-in/PasswordSignInPage.tsx
+++ b/apps/console/src/pages/iam/auth/sign-in/PasswordSignInPage.tsx
@@ -67,7 +67,7 @@ export default function PasswordSignInPage() {
   };
 
   return (
-    <form className="space-y-4" onSubmit={handlePasswordLogin}>
+    <form className="space-y-6 w-full max-w-md mx-auto" onSubmit={handlePasswordLogin}>
       <Link
         to="/auth/login"
         className="flex items-center gap-2 text-txt-secondary hover:text-txt-primary transition-colors mb-4"
@@ -83,24 +83,26 @@ export default function PasswordSignInPage() {
         {__("Enter your email and password")}
       </p>
 
-      <Field
-        required
-        placeholder={__("Email")}
-        name="email"
-        type="email"
-        label={__("Email")}
-        autoFocus
-      />
+      <div className="space-y-4">
+        <Field
+          required
+          placeholder={__("Email")}
+          name="email"
+          type="email"
+          label={__("Email")}
+          autoFocus
+        />
 
-      <Field
-        required
-        placeholder={__("Password")}
-        name="password"
-        type="password"
-        label={__("Password")}
-      />
+        <Field
+          required
+          placeholder={__("Password")}
+          name="password"
+          type="password"
+          label={__("Password")}
+        />
+      </div>
 
-      <Button className="w-full" disabled={isSigningIn}>
+      <Button className="w-xs h-10 mx-auto mt-6" disabled={isSigningIn}>
         {isSigningIn ? __("Logging in...") : __("Login")}
       </Button>
 
diff --git a/apps/console/src/pages/iam/auth/sign-in/SSOSignInPage.tsx b/apps/console/src/pages/iam/auth/sign-in/SSOSignInPage.tsx
index f029073e7..d9817746a 100644
--- a/apps/console/src/pages/iam/auth/sign-in/SSOSignInPage.tsx
+++ b/apps/console/src/pages/iam/auth/sign-in/SSOSignInPage.tsx
@@ -37,7 +37,7 @@ export default function SSOSignInPage() {
 
   return (
     <>
-      <form className="space-y-4" onSubmit={handleSSOCheck}>
+      <form className="space-y-6 w-full max-w-md mx-auto" onSubmit={handleSSOCheck}>
         <Link
           to="/auth/login"
           className="flex items-center gap-2 text-txt-secondary hover:text-txt-primary transition-colors mb-4"
@@ -62,7 +62,7 @@ export default function SSOSignInPage() {
           autoFocus
         />
 
-        <Button className="w-full" disabled={checking}>
+        <Button className="w-xs h-10 mx-auto mt-6" disabled={checking}>
           {checking ? __("Checking...") : __("Continue with SSO")}
         </Button>
 
diff --git a/apps/console/src/pages/iam/auth/sign-in/SignInPage.tsx b/apps/console/src/pages/iam/auth/sign-in/SignInPage.tsx
index 596b89042..45aa60473 100644
--- a/apps/console/src/pages/iam/auth/sign-in/SignInPage.tsx
+++ b/apps/console/src/pages/iam/auth/sign-in/SignInPage.tsx
@@ -6,7 +6,7 @@ export default function SignInPage() {
   const { __ } = useTranslate();
 
   return (
-    <div className="space-y-4">
+    <div className="space-y-6 w-full max-w-md mx-auto">
       <h1 className="text-center text-2xl font-bold">
         {__("Login to your account")}
       </h1>
@@ -14,7 +14,7 @@ export default function SignInPage() {
         {__("Choose your login method")}
       </p>
 
-      <Button className="w-full" to="/auth/password-login">
+      <Button className="w-xs h-10 mx-auto" to="/auth/password-login">
         {__("Login with Email")}
       </Button>
 
@@ -32,7 +32,7 @@ export default function SignInPage() {
         </div>
       </div>
 
-      <Button variant="secondary" className="w-full" to="/auth/sso-login">
+      <Button variant="secondary" className="w-xs h-10 mx-auto" to="/auth/sso-login">
         {__("Login with SSO")}
       </Button>
 
diff --git a/apps/console/src/pages/iam/auth/sign-up/SignUpFromInvitationPage.tsx b/apps/console/src/pages/iam/auth/sign-up/SignUpFromInvitationPage.tsx
index 0bd747020..1cbdbbf87 100644
--- a/apps/console/src/pages/iam/auth/sign-up/SignUpFromInvitationPage.tsx
+++ b/apps/console/src/pages/iam/auth/sign-up/SignUpFromInvitationPage.tsx
@@ -122,7 +122,7 @@ export default function SignUpFromInvitationPage() {
           error={formState.errors.password?.message}
         />
 
-        <Button type="submit" className="w-full" disabled={formState.isLoading}>
+        <Button type="submit" className="w-xs h-10 mx-auto mt-6" disabled={formState.isLoading}>
           {formState.isLoading
             ? __("Creating account...")
             : __("Create account")}
diff --git a/apps/console/src/pages/iam/auth/sign-up/SignUpPage.tsx b/apps/console/src/pages/iam/auth/sign-up/SignUpPage.tsx
index e8e8a1ab6..57e266622 100644
--- a/apps/console/src/pages/iam/auth/sign-up/SignUpPage.tsx
+++ b/apps/console/src/pages/iam/auth/sign-up/SignUpPage.tsx
@@ -117,7 +117,7 @@ export default function SignUpPage() {
           error={formState.errors.password?.message}
         />
 
-        <Button type="submit" className="w-full" disabled={formState.isLoading}>
+        <Button type="submit" className="w-xs h-10 mx-auto mt-6" disabled={formState.isLoading}>
           {formState.isLoading
             ? __("Creating account...")
             : __("Sign up with email")}
diff --git a/apps/trust/src/pages/auth/AuthLayout.tsx b/apps/trust/src/pages/auth/AuthLayout.tsx
index d49c0e7b5..0bcc18ae4 100644
--- a/apps/trust/src/pages/auth/AuthLayout.tsx
+++ b/apps/trust/src/pages/auth/AuthLayout.tsx
@@ -1,5 +1,5 @@
 import { useSystemTheme } from "@probo/hooks";
-import { Logo } from "@probo/ui";
+import { Card, Logo } from "@probo/ui";
 import { type PreloadedQuery, usePreloadedQuery } from "react-relay";
 import { Outlet } from "react-router";
 import { graphql } from "relay-runtime";
@@ -26,25 +26,19 @@ export function AuthLayout(props: { queryRef: PreloadedQuery<AuthLayoutQuery> })
     : compliancePage.logoFileUrl;
 
   return (
-    <div className="grid grid-cols-1 lg:grid-cols-2 min-h-screen text-txt-primary">
-      <div className="bg-level-0 flex flex-col items-center justify-center">
-        <div className="w-full max-w-md px-6">
-          <Outlet />
-        </div>
-      </div>
-      <div className="hidden lg:flex bg-dialog font-bold flex-col items-center justify-center p-8 text-txt-primary lg:p-10">
-        <div className="flex flex-col items-center justify-center gap-4">
-          {logoFileUrl
-            ? (
-                <img
-                  alt=""
-                  src={logoFileUrl}
-                  className="size-[440px] rounded-2xl"
-                />
-              )
-            : <Logo withPicto className="w-[440px]" />}
-        </div>
-      </div>
+    <div className="min-h-screen text-txt-primary bg-level-0 flex flex-col items-center justify-center">
+      <Card className="w-full max-w-lg px-12 py-8 flex flex-col items-center justify-center gap-8">
+        {logoFileUrl
+          ? (
+              <img
+                alt=""
+                src={logoFileUrl}
+                className="h-20 rounded-2xl"
+              />
+            )
+          : <Logo withPicto className="w-[440px]" />}
+        <Outlet />
+      </Card>
     </div>
   );
 }
diff --git a/apps/trust/src/pages/auth/ConnectPage.tsx b/apps/trust/src/pages/auth/ConnectPage.tsx
index 00a844498..dd0fc85a9 100644
--- a/apps/trust/src/pages/auth/ConnectPage.tsx
+++ b/apps/trust/src/pages/auth/ConnectPage.tsx
@@ -128,7 +128,7 @@ export function ConnectPage(props: {
     <div className="space-y-6 w-full max-w-md mx-auto">
       <div className="space-y-2 text-center">
         <h1 className="text-3xl font-bold">
-          {__(`Connect to ${organization.name}'s compliance page`)}
+          {__("Connect to Compliance Page")}
         </h1>
         <p className="text-txt-tertiary">
           {__(
@@ -137,7 +137,7 @@ export function ConnectPage(props: {
         </p>
       </div>
 
-      <form onSubmit={e => void handleSubmit(e)} className="space-y-4">
+      <form onSubmit={e => void handleSubmit(e)} className="space-y-6">
         <Field
           label={__("Email")}
           placeholder="john.doe@acme.com"
@@ -156,7 +156,7 @@ export function ConnectPage(props: {
 
         <Button
           type="submit"
-          className="w-full"
+          className="w-xs h-10 mx-auto"
           disabled={formState.isSubmitting || (magicLinkSent && timer !== 0)}
         >
           {magicLinkSent
diff --git a/apps/trust/src/pages/auth/VerifyMagicLinkPage.tsx b/apps/trust/src/pages/auth/VerifyMagicLinkPage.tsx
index 72843ce8d..38f022495 100644
--- a/apps/trust/src/pages/auth/VerifyMagicLinkPage.tsx
+++ b/apps/trust/src/pages/auth/VerifyMagicLinkPage.tsx
@@ -94,7 +94,7 @@ export default function VerifyMagicLinkPagePageMutation() {
         </p>
       </div>
 
-      <form onSubmit={e => void handleSubmit(e)} className="space-y-4">
+      <form onSubmit={e => void handleSubmit(e)} className="space-y-6">
         <Field
           label={__("Confirmation Token")}
           type="text"
@@ -109,7 +109,7 @@ export default function VerifyMagicLinkPagePageMutation() {
 
         <Button
           type="submit"
-          className="w-full"
+          className="w-xs h-10 mx-auto"
           disabled={form.formState.isSubmitting}
         >
           {form.formState.isSubmitting