diff --git a/src/api/templates/dashboard.html b/src/api/templates/dashboard.html
index faab547..3408c43 100644
--- a/src/api/templates/dashboard.html
+++ b/src/api/templates/dashboard.html
@@ -147,27 +147,52 @@
         .birthday-list {
             display: flex;
             flex-direction: column;
-            gap: 0.5rem;
+            gap: 1rem;
         }
 
         .birthday-item {
+            display: block;
+            background: #fff;
+            border-radius: 8px;
+            padding: 1rem 1.25rem;
+            box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+            text-decoration: none;
+            color: inherit;
+            transition: box-shadow 0.15s, transform 0.15s;
+        }
+
+        .birthday-item:hover {
+            box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+            transform: translateY(-1px);
+        }
+
+        .birthday-header {
             display: flex;
             justify-content: space-between;
-            align-items: center;
-            padding: 0.5rem 0.75rem;
-            background: #f8f9fa;
-            border-radius: 6px;
+            align-items: flex-start;
+            gap: 1rem;
         }
 
         .birthday-name {
+            font-size: 1.125rem;
+            font-weight: 600;
+            color: #222;
+        }
+
+        .birthday-organization {
             font-size: 0.875rem;
-            color: #333;
+            color: #666;
+            margin-top: 0.25rem;
         }
 
         .birthday-date {
-            font-size: 0.8rem;
+            font-size: 0.875rem;
             color: #888;
-            white-space: nowrap;
+            margin-top: 0.25rem;
+        }
+
+        .birthday-date::before {
+            content: "\1F382 ";
         }
 
         .empty-state {
@@ -273,20 +298,19 @@
             {% if upcoming_birthdays %}
             <div class="birthday-list">
                 {% for b in upcoming_birthdays %}
-                <div class="birthday-item"{% if b.birthday.month == today.month and b.birthday.day == today.day %} style="background: #fff3cd;"{% endif %}>
-                    <div class="birthday-name">
-                        <a href="/contacts/{{ b.id }}" style="color: #0066cc; text-decoration: none;">{{ b.full_name or '(Kein Name)' }}</a>
-                        {% if b.organization %}
-                        <span style="color: #888; font-size: 0.8rem;"> · {{ b.organization }}</span>
-                        {% endif %}
+                <a href="/contacts/{{ b.id }}" class="birthday-item"{% if b.birthday.month == today.month and b.birthday.day == today.day %} style="background: #fff3cd;"{% endif %}>
+                    <div class="birthday-header">
+                        <div>
+                            <div class="birthday-name">{{ b.full_name or '(Kein Name)' }}</div>
+                            {% if b.organization %}
+                            <div class="birthday-organization">{{ b.organization }}</div>
+                            {% endif %}
+                            <div class="birthday-date">
+                                {{ b.birthday.strftime('%d.%m.') }}{% if b.birthday.year and b.birthday.year < current_year %} · {{ current_year - b.birthday.year }} Jahre{% endif %}
+                            </div>
+                        </div>
                     </div>
-                    <div class="birthday-date">
-                        {{ b.birthday.strftime('%d.%m.') }}
-                        {% if b.birthday.year and b.birthday.year < current_year %}
-                        · {{ current_year - b.birthday.year }} Jahre
-                        {% endif %}
-                    </div>
-                </div>
+                </a>
                 {% endfor %}
             </div>
             {% else %}