diff --git a/Week-01/Day_04/index.html b/Week-01/Day_04/index.html
new file mode 100644
index 0000000..1121161
--- /dev/null
+++ b/Week-01/Day_04/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>CSS Basics Combined Task</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+
+    <main class="container">
+        
+        <div class="profile-card">
+            
+            <img src="profile.jpg" alt="Profile Picture" class="profile-img">
+
+            <h1 class="user-name">Rupesh Bangar</h1>
+            <p class="tagline">Junior Web Developer</p>
+
+            <div class="bio-box">
+                <p><strong>Bio:</strong> This is a long biography to demonstrate the overflow property. CSS allows us to handle content that is larger than its container. By setting the height and the overflow property, we can ensure the layout stays intact while the user can still read all the text by scrolling inside this specific box.</p>
+            </div>
+
+            <form class="contact-form">
+                <input type="email" placeholder="Enter your email" required>
+                <button type="submit" id="submit-btn">Contact Me</button>
+            </form>
+        </div>
+    </main>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/Week-01/Day_04/profile.jpg b/Week-01/Day_04/profile.jpg
new file mode 100644
index 0000000..ffb7932
Binary files /dev/null and b/Week-01/Day_04/profile.jpg differ
diff --git a/Week-01/Day_04/style.css b/Week-01/Day_04/style.css
new file mode 100644
index 0000000..a56557d
--- /dev/null
+++ b/Week-01/Day_04/style.css
@@ -0,0 +1,88 @@
+:root {
+    --primary-color: #4a90e2;
+}
+
+body {
+    font-family: 'Segoe UI', sans-serif;
+    background-color: #f0f2f5;
+    margin: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+}
+
+.profile-card {
+    background-color: white;
+    width: 350px;
+    max-width: 90%;
+    padding: 2rem;
+    border: 2px solid #ddd;
+    border-radius: 15px;    
+    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
+    text-align: center;
+}
+
+.profile-img {
+    width: 120px;
+    height: 120px;
+    border-radius: 50%;     
+    object-fit: cover;
+    border: 4px solid var(--primary-color);
+    margin-bottom: 1rem;    
+}
+
+.user-name {
+    color: #333;
+    margin: 0;
+    font-size: 1.5rem;      
+}
+
+.tagline {
+    color: #777;
+    font-style: italic;
+    margin-bottom: 1.5rem;
+}
+
+.bio-box {
+    height: 80px;           
+    overflow-y: auto;       
+    background: #f9f9f9;
+    padding: 10px;
+    border: 1px solid #eee;
+    font-size: 0.9rem;
+    margin-bottom: 1.5rem;
+    text-align: left;
+}
+
+.contact-form {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+input[type="email"] {
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    outline: none;
+}
+
+input[type="email"]:focus {
+    border-color: var(--primary-color);
+}
+
+#submit-btn {
+    background-color: var(--primary-color);
+    color: white;
+    padding: 10px;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+    font-weight: bold;
+    transition: background 0.3s;
+}
+
+#submit-btn:hover {
+    background-color: #357abd;
+}
\ No newline at end of file
