diff --git a/app/templates/base.html b/app/templates/base.html
index ff02cc8..fc24fc6 100644
--- a/app/templates/base.html
+++ b/app/templates/base.html
@@ -16,7 +16,7 @@
 
     {% block extra_head %}{% endblock %}
 </head>
-<body>
+<body class="{% block body_class %}{% endblock %}">
     {% block navbar %}
     <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
         <div class="container-fluid">
diff --git a/app/templates/login.html b/app/templates/login.html
index 9eed582..3e5deff 100644
--- a/app/templates/login.html
+++ b/app/templates/login.html
@@ -4,6 +4,8 @@
 
 {% block navbar %}{% endblock %}
 
+{% block body_class %}login-page{% endblock %}
+
 {% block content %}
 <div class="container auth-wrapper">
     <div class="row justify-content-center">
@@ -11,7 +13,9 @@
             <div class="card shadow-lg" style="border: none; border-radius: 15px;">
                 <div class="card-body p-5">
                     <div class="text-center mb-4">
-                        <img src="{{ url_for('static', path='/logo/delphi-logo.webp') }}" alt="Delphi Logo" class="mb-4" style="width: 120px; height: 120px; object-fit: contain;">
+                        <div class="auth-logo mx-auto mb-4">
+                            <img src="{{ url_for('static', path='/logo/delphi-logo.webp') }}" alt="Delphi Logo">
+                        </div>
                         <h2 class="card-title mb-2">Welcome Back</h2>
                         <p class="text-muted">Sign in to access Delphi Database</p>
                     </div>
diff --git a/static/css/custom.css b/static/css/custom.css
index de25734..4d1782d 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -7,6 +7,9 @@ body {
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
 }
 
+/* Hide navbar for login page */
+.login-page .navbar { display: none; }
+
 /* Avoid overriding Bootstrap's global .container layout.
    Provide a scoped helper for auth pages instead. */
 .auth-wrapper {
@@ -36,6 +39,10 @@ body {
     box-shadow: none;
 }
 
+/* Auth logo scales close to button width */
+.auth-logo { max-width: 320px; }
+.auth-logo img { width: 100%; height: auto; object-fit: contain; }
+
 /* Input group styling */
 .input-group-lg .form-control {
     border-radius: 8px !important;
