diff --git a/Domains/Frontend/MiniProjects/Study-nest/index.html b/Domains/Frontend/MiniProjects/Study-nest/index.html
new file mode 100644
index 00000000..3fa92ad1
--- /dev/null
+++ b/Domains/Frontend/MiniProjects/Study-nest/index.html
@@ -0,0 +1,133 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>STUDY NEST - SPPU Engineering PYQs</title>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Roboto:wght@400;500&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    
+    <link rel="stylesheet" href="style.css">
+</head>
+<body class="font-content bg-white min-h-screen">
+
+    <header class="sticky-header">
+        <div class="container header-content">
+            <div class="logo-area">
+                <h1 class="logo-text">STUDY NEST</h1>
+                <p class="tagline">Your One Stop Solution for SPPU Engineering PYQs</p>
+            </div>
+            <nav class="nav-bar" id="main-nav">
+                <a href="#" data-page="home" class="nav-link active">Home</a>
+                <a href="#" data-page="branches" class="nav-link">Branches</a>
+                <a href="#" data-page="patterns" class="nav-link">Patterns</a>
+                <a href="#" data-page="years" class="nav-link">Years</a>
+                <a href="#" data-page="about" class="nav-link">About</a>
+                <a href="#" data-page="contact" class="nav-link">Contact</a>
+            </nav>
+        </div>
+        
+        <div class="search-section">
+            <div class="container search-container">
+                <div class="search-box">
+                    <i class="fas fa-search search-icon"></i>
+                    <input type="search" id="search-input" 
+                           placeholder="Search for your question papers by branch, year, or pattern..." 
+                           class="search-input">
+                    <button class="search-btn">Search</button>
+                </div>
+            </div>
+        </div>
+    </header>
+
+    <main class="container main-content">
+        
+        <section id="page-home" class="page-section active-page">
+            <section id="branches" class="section-container">
+                <h2 class="section-title"><i class="fas fa-book-open icon-highlight"></i> Browse by Branch</h2>
+                <div class="card-grid" id="branch-cards"></div>
+            </section>
+            
+            <section id="patterns" class="section-container">
+                <h2 class="section-title"><i class="fas fa-file-alt icon-highlight"></i> Choose Exam Pattern</h2>
+                <div class="card-grid pattern-grid" id="pattern-cards"></div>
+            </section>
+
+            <section id="years" class="section-container">
+                <h2 class="section-title"><i class="fas fa-calendar-alt icon-highlight"></i> Select Academic Year</h2>
+                <div class="year-links" id="year-links"></div>
+            </section>
+
+            <section class="download-placeholder">
+                <h2 class="placeholder-title"><i class="fas fa-star icon-highlight"></i> Most Downloaded Papers</h2>
+                <p>Data would be loaded here dynamically showing the top 5 papers across all branches.</p>
+                <a href="#" data-page="papers" class="link-primary nav-link">Browse All Papers <i class="fas fa-arrow-right"></i></a>
+            </section>
+        </section>
+
+        <section id="page-branches" class="page-section">
+            <h1 class="page-heading">Branch Selection</h1>
+            <p class="text-gray">Click on a branch below to see its available papers and subjects.</p>
+            <div id="branch-grid-full" class="card-grid section-container">
+                </div>
+        </section>
+
+        <section id="page-papers" class="page-section">
+            <h1 class="page-heading">PYQ Papers for <span id="papers-title">All Branches & Patterns</span></h1>
+            <p class="text-gray">Use the filters below to refine your search.</p>
+            
+            <div class="papers-layout">
+                <aside class="sidebar-filters">
+                    <h3>Refine Results</h3>
+                    <div id="filter-patterns" class="filter-group"></div>
+                    <div id="filter-years" class="filter-group"></div>
+                    <div id="filter-subjects" class="filter-group mt-5"></div>
+                </aside>
+                <div class="paper-list" id="paper-list">
+                    </div>
+            </div>
+            
+            <div id="dynamic-content-area" class="section-container mt-8">
+                </div>
+        </section>
+
+        <section id="page-about" class="page-section">
+            <h1 class="page-heading">About STUDY NEST 💡</h1>
+            <div class="about-content">
+                <p>STUDY NEST is your dedicated, hassle-free resource for accessing **SPPU Engineering Previous Year Question Papers (PYQs)**. Built by students, for students, we aim to minimize study stress by providing a clean, fast, and comprehensive platform.</p>
+                <h3 class="mt-4">Our Vision</h3>
+                <p>To be the single, most reliable source for all SPPU engineering students, ensuring every paper is available for every branch and every pattern (2012, 2019, 2024).</p>
+                <h3 class="mt-4">Inspiration</h3>
+                <p>Our design and commitment to quality content are inspired by the excellent user experience of GeeksforGeeks—clean, readable, and content-first.</p>
+            </div>
+        </section>
+
+        <section id="page-contact" class="page-section">
+            <h1 class="page-heading">Get in Touch 📞</h1>
+            <div class="contact-form-container">
+                <p>Have a question, suggestion, or a paper you want to submit? We'd love to hear from you!</p>
+                <form id="contact-form" class="mt-4">
+                    <input type="text" placeholder="Your Name" required>
+                    <input type="email" placeholder="Your SPPU Email" required>
+                    <textarea placeholder="Your Message or Paper Request..." rows="5" required></textarea>
+                    <button type="submit" class="submit-btn">Send Message</button>
+                </form>
+            </div>
+        </section>
+
+    </main>
+    
+    <footer>
+        <div class="container footer-content">
+            <p>&copy; 2024 STUDY NEST. All rights reserved. | SPPU PYQs.</p>
+            <div class="social-icons">
+                <a href="#"><i class="fab fa-facebook-f"></i></a>
+                <a href="#"><i class="fab fa-twitter"></i></a>
+                <a href="#"><i class="fab fa-linkedin-in"></i></a>
+            </div>
+        </div>
+    </footer>
+
+    <script src="main.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/Domains/Frontend/MiniProjects/Study-nest/main.js b/Domains/Frontend/MiniProjects/Study-nest/main.js
new file mode 100644
index 00000000..98596cd0
--- /dev/null
+++ b/Domains/Frontend/MiniProjects/Study-nest/main.js
@@ -0,0 +1,267 @@
+// js/main.js
+
+document.addEventListener('DOMContentLoaded', () => {
+    
+    // --- Detailed Mock Data ---
+    
+    // 1. Core Data
+    const branches = [
+        { id: 'Comp', name: 'Computer Engineering', icon: 'fas fa-laptop-code' },
+        { id: 'IT', name: 'Information Technology', icon: 'fas fa-server' },
+        { id: 'ENTC', name: 'Electronics & Telecommunication', icon: 'fas fa-broadcast-tower' },
+        { id: 'Mech', name: 'Mechanical Engineering', icon: 'fas fa-cogs' },
+        { id: 'Civil', name: 'Civil Engineering', icon: 'fas fa-city' },
+        { id: 'Elec', name: 'Electrical Engineering', icon: 'fas fa-bolt' },
+    ];
+
+    const patterns = [
+        { id: 'R2012', title: '2012 Pattern', description: 'Older PYQs (Pre-CBCS)' },
+        { id: 'R2019', title: '2019 Pattern (CBCS)', description: 'Current Regular Syllabus' },
+        { id: 'R2024', title: '2024 Pattern (NEP)', description: 'Upcoming Syllabus' },
+    ];
+    
+    const years = ['FE', 'SE', 'TE', 'BE'];
+
+    // 2. Mock Paper Data (A small, filtered sample for R2019 Comp Engg)
+    const mockPapers = [
+        // SE Comp R2019
+        { id: 1, branch: 'Comp', year: 'SE', pattern: 'R2019', subject: 'Data Structures and Algorithms', exam: 'May 2023', size: '1.2MB' },
+        { id: 2, branch: 'Comp', year: 'SE', pattern: 'R2019', subject: 'Object Oriented Programming', exam: 'Dec 2022', size: '1.1MB' },
+        // TE Comp R2019
+        { id: 3, branch: 'Comp', year: 'TE', pattern: 'R2019', subject: 'Database Management System', exam: 'May 2023', size: '1.5MB' },
+        { id: 4, branch: 'Comp', year: 'TE', pattern: 'R2019', subject: 'Computer Networks', exam: 'Dec 2021', size: '0.9MB' },
+        // FE Common R2019
+        { id: 5, branch: 'Comp', year: 'FE', pattern: 'R2019', subject: 'Engineering Mathematics I', exam: 'May 2023', size: '2.1MB' },
+        { id: 6, branch: 'Mech', year: 'FE', pattern: 'R2019', subject: 'Engineering Graphics', exam: 'Dec 2022', size: '1.8MB' },
+    ];
+
+    // --- 2. SPA Navigation Logic ---
+    
+    const pageSections = document.querySelectorAll('.page-section');
+    const navLinks = document.querySelectorAll('.nav-link');
+    
+    // State to track current filters
+    let currentFilters = {
+        page: 'home',
+        branch: null,
+        pattern: null,
+        year: null
+    };
+
+    /** Switches the active view/page in the SPA simulation. */
+    const navigateTo = (pageId, branchId = null, patternId = null, year = null) => {
+        // 1. Update State
+        currentFilters.page = pageId;
+        currentFilters.branch = branchId;
+        currentFilters.pattern = patternId;
+        currentFilters.year = year;
+
+        // 2. Update Visuals (Page)
+        pageSections.forEach(section => {
+            section.classList.remove('active-page');
+        });
+        document.getElementById(`page-${pageId}`).classList.add('active-page');
+
+        // 3. Update Visuals (Nav Links)
+        navLinks.forEach(link => {
+            link.classList.remove('active');
+            if (link.dataset.page === pageId) {
+                link.classList.add('active');
+            }
+        });
+
+        // 4. Load Dynamic Content
+        if (pageId === 'branches') {
+            renderBranchGrid('branch-grid-full');
+        }
+        if (pageId === 'papers') {
+            loadPapersPage();
+        }
+        if (pageId === 'home') {
+             // Re-render home cards if necessary
+             renderBranchGrid('branch-cards');
+             renderPatternCards('pattern-cards');
+             renderYearButtons('year-links');
+        }
+    };
+
+    // Attach navigation listeners to nav links
+    navLinks.forEach(link => {
+        link.addEventListener('click', (e) => {
+            e.preventDefault();
+            const pageId = e.currentTarget.dataset.page;
+            navigateTo(pageId);
+        });
+    });
+
+    // --- 3. Rendering Functions (Home & Branch Pages) ---
+
+    /** Renders the branch cards into the specified container. */
+    const renderBranchGrid = (containerId) => {
+        const container = document.getElementById(containerId);
+        if (!container) return;
+        container.innerHTML = '';
+
+        branches.forEach(branch => {
+            const card = document.createElement('div');
+            card.className = 'branch-card';
+            card.innerHTML = `
+                <div class="card-icon-container"><i class="${branch.icon} card-icon"></i></div>
+                <h3 class="card-title">${branch.name}</h3>
+            `;
+            // Interactive Link: Clicking a branch card navigates to the papers page, pre-filtered
+            card.addEventListener('click', () => {
+                navigateTo('papers', branch.id, null, null);
+            });
+            container.appendChild(card);
+        });
+    };
+    
+    /** Renders the pattern cards into the specified container. */
+    const renderPatternCards = (containerId) => {
+        const container = document.getElementById(containerId);
+        if (!container) return;
+        container.innerHTML = '';
+        
+        patterns.forEach(pattern => {
+            const card = document.createElement('div');
+            card.className = 'pattern-card';
+            card.innerHTML = `
+                <div class="card-icon-container"><i class="fas fa-scroll card-icon"></i></div>
+                <h3 class="card-title">${pattern.title}</h3>
+                <p class="card-description">${pattern.description}</p>
+            `;
+            // Interactive Link: Clicking a pattern card navigates to the papers page, pre-filtered
+            card.addEventListener('click', () => {
+                navigateTo('papers', null, pattern.id, null);
+            });
+            container.appendChild(card);
+        });
+    };
+    
+    /** Renders the year buttons into the specified container. */
+    const renderYearButtons = (containerId) => {
+        const container = document.getElementById(containerId);
+        if (!container) return;
+        container.innerHTML = '';
+        
+        years.forEach(year => {
+            const button = document.createElement('button');
+            button.className = 'year-btn';
+            button.textContent = year;
+            button.addEventListener('click', () => {
+                // Interactive Link: Clicking a year button navigates to the papers page, pre-filtered
+                navigateTo('papers', null, null, year);
+            });
+            container.appendChild(button);
+        });
+    };
+    
+    // --- 4. Papers Page Logic (Interactive Filtering) ---
+
+    /** Loads and initializes the papers page content based on current filters. */
+    const loadPapersPage = () => {
+        const paperListContainer = document.getElementById('paper-list');
+        const papersTitle = document.getElementById('papers-title');
+        
+        // 1. Set Title
+        let title = 'All Branches & Patterns';
+        if (currentFilters.branch) {
+            const branchName = branches.find(b => b.id === currentFilters.branch)?.name;
+            title = `${branchName || 'Unknown'} PYQs`;
+        }
+        if (currentFilters.pattern) {
+             const patternTitle = patterns.find(p => p.id === currentFilters.pattern)?.title;
+             title += ` (${patternTitle || 'Unknown Pattern'})`;
+        }
+        if (currentFilters.year) {
+             title += ` - ${currentFilters.year}`;
+        }
+        papersTitle.textContent = title;
+
+        // 2. Render Filters Sidebar
+        renderFilterSidebar();
+
+        // 3. Render Paper List (Filtered)
+        renderPaperList(paperListContainer);
+    };
+
+    /** Renders the interactive filter groups in the sidebar. */
+    const renderFilterSidebar = () => {
+        const filterPatterns = document.getElementById('filter-patterns');
+        const filterYears = document.getElementById('filter-years');
+        
+        // --- Pattern Filters ---
+        filterPatterns.innerHTML = '<label>Filter by Pattern:</label>';
+        patterns.forEach(p => {
+            const btn = document.createElement('button');
+            btn.className = `year-filter-btn ${currentFilters.pattern === p.id ? 'filter-active' : ''}`;
+            btn.textContent = p.title;
+            btn.addEventListener('click', () => {
+                // Interactive Filter: Clicking updates the pattern filter and reloads the page content
+                currentFilters.pattern = currentFilters.pattern === p.id ? null : p.id;
+                loadPapersPage();
+            });
+            filterPatterns.appendChild(btn);
+        });
+
+        // --- Year Filters ---
+        filterYears.innerHTML = '<label>Filter by Year:</label>';
+        years.forEach(y => {
+            const btn = document.createElement('button');
+            btn.className = `year-filter-btn ${currentFilters.year === y ? 'filter-active' : ''}`;
+            btn.textContent = y;
+            btn.addEventListener('click', () => {
+                // Interactive Filter: Clicking updates the year filter and reloads the page content
+                currentFilters.year = currentFilters.year === y ? null : y;
+                loadPapersPage();
+            });
+            filterYears.appendChild(btn);
+        });
+    };
+
+    /** Renders the filtered paper list. */
+    const renderPaperList = (container) => {
+        let filteredPapers = mockPapers.filter(paper => {
+            // Apply Branch Filter
+            if (currentFilters.branch && paper.branch !== currentFilters.branch) return false;
+            // Apply Pattern Filter
+            if (currentFilters.pattern && paper.pattern !== currentFilters.pattern) return false;
+            // Apply Year Filter
+            if (currentFilters.year && paper.year !== currentFilters.year) return false;
+            return true;
+        });
+
+        container.innerHTML = ''; // Clear previous list
+
+        if (filteredPapers.length === 0) {
+            container.innerHTML = '<p class="text-gray mt-5">No papers found matching your selection. Try clearing some filters!</p>';
+            return;
+        }
+
+        filteredPapers.forEach(paper => {
+            const item = document.createElement('div');
+            item.className = 'paper-item';
+            item.innerHTML = `
+                <div class="paper-subject">${paper.subject}</div>
+                <div class="paper-meta">
+                    Branch: ${paper.branch} | Year: ${paper.year} | Pattern: ${paper.pattern} | Exam: ${paper.exam}
+                </div>
+                <button class="download-btn">
+                    <i class="fas fa-file-pdf"></i> Download (${paper.size})
+                </button>
+            `;
+            container.appendChild(item);
+        });
+    };
+
+    // --- 5. Initialization ---
+
+    // Render initial cards and set the home page active
+    renderBranchGrid('branch-cards');
+    renderPatternCards('pattern-cards');
+    renderYearButtons('year-links');
+    
+    // Ensure the home page is the initial view
+    navigateTo('home'); 
+});
\ No newline at end of file
diff --git a/Domains/Frontend/MiniProjects/Study-nest/style.css b/Domains/Frontend/MiniProjects/Study-nest/style.css
new file mode 100644
index 00000000..2ff072c3
--- /dev/null
+++ b/Domains/Frontend/MiniProjects/Study-nest/style.css
@@ -0,0 +1,371 @@
+/* Color Palette */
+:root {
+    --color-primary: #0F9D58;    /* Main Green */
+    --color-accent: #34A853;     /* Button/Highlight Green */
+    --color-bg-light: #E8F5E9;   /* Light Green Background */
+    --color-text-dark: #212121;  /* Dark Text */
+    --color-text-gray: #555;
+    --shadow-subtle: 0 4px 12px rgba(0, 0, 0, 0.08);
+    --shadow-hover: 0 8px 16px rgba(0, 0, 0, 0.15);
+}
+
+/* Typography */
+.font-heading { font-family: 'Poppins', sans-serif; }
+.font-content { font-family: 'Roboto', sans-serif; }
+
+/* Base Styles */
+* {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+}
+body {
+    line-height: 1.6;
+    color: var(--color-text-dark);
+}
+.container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 20px;
+}
+a {
+    text-decoration: none;
+    color: var(--color-text-dark);
+    transition: color 0.2s;
+}
+
+/* === SPA Simulation & Page Hiding === */
+.page-section {
+    display: none; /* Default state: hidden */
+    padding-top: 40px;
+    padding-bottom: 40px;
+    animation: fadeIn 0.4s ease-out;
+}
+.page-section.active-page {
+    display: block; /* Active state: visible */
+}
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(10px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.page-heading {
+    font-size: 36px;
+    font-family: 'Poppins', sans-serif;
+    font-weight: 700;
+    color: var(--color-primary);
+    margin-bottom: 20px;
+    border-bottom: 3px solid var(--color-bg-light);
+    padding-bottom: 10px;
+}
+.text-gray {
+    color: var(--color-text-gray);
+    margin-bottom: 30px;
+}
+.mt-4 { margin-top: 1rem; }
+.mt-5 { margin-top: 1.25rem; }
+/* === HEADER & NAVIGATION (Existing styles maintained) === */
+.sticky-header {
+    position: sticky;
+    top: 0;
+    z-index: 50;
+    background-color: white;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    border-top: 4px solid var(--color-primary);
+}
+.header-content {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px 20px;
+}
+.logo-text {
+    font-size: 24px;
+    font-weight: 700;
+    color: var(--color-primary);
+    font-family: 'Poppins', sans-serif;
+}
+.tagline {
+    font-size: 11px;
+    color: var(--color-text-gray);
+    display: none;
+}
+.nav-bar a {
+    margin-left: 20px;
+    font-size: 14px;
+    font-weight: 500;
+    padding: 5px 0;
+}
+.nav-bar a:hover, .nav-bar a.active {
+    color: var(--color-primary);
+    border-bottom: 2px solid var(--color-primary);
+}
+
+/* === SEARCH BAR (Existing styles maintained) === */
+.search-section {
+    background-color: var(--color-bg-light);
+    padding: 15px 0;
+    border-top: 1px solid rgba(0, 0, 0, 0.05);
+}
+.search-box {
+    position: relative;
+    display: flex;
+    max-width: 800px;
+    margin: 0 auto;
+    border: 1px solid #ccc;
+    border-radius: 8px;
+    overflow: hidden;
+}
+.search-icon {
+    position: absolute;
+    left: 12px;
+    top: 50%;
+    transform: translateY(-50%);
+    color: #999;
+}
+.search-input {
+    width: 100%;
+    padding: 10px 10px 10px 40px;
+    border: none;
+    outline: none;
+    font-size: 16px;
+}
+.search-btn {
+    background-color: var(--color-accent);
+    color: white;
+    padding: 10px 20px;
+    border: none;
+    cursor: pointer;
+    font-weight: 500;
+    transition: background-color 0.2s;
+    flex-shrink: 0;
+    display: none;
+}
+.search-btn:hover {
+    background-color: var(--color-primary);
+}
+
+/* === HOME/SECTION STYLES (Existing styles maintained) === */
+.section-container {
+    margin-bottom: 50px;
+}
+.section-title {
+    font-size: 28px;
+    font-family: 'Poppins', sans-serif;
+    font-weight: 700;
+    margin-bottom: 25px;
+    border-left: 4px solid var(--color-accent);
+    padding-left: 15px;
+}
+.icon-highlight {
+    color: var(--color-accent);
+    margin-right: 10px;
+}
+
+/* === CARD GRID & CARD STYLES (Existing styles maintained) === */
+.card-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+    gap: 20px;
+}
+.branch-card, .pattern-card, .year-filter-btn { /* Added year filter class for generic style */
+    background-color: white;
+    padding: 20px;
+    border-radius: 12px;
+    border-top: 4px solid var(--color-primary);
+    box-shadow: var(--shadow-subtle);
+    transition: all 0.3s ease;
+    text-align: center;
+    cursor: pointer;
+    display: block; /* Ensure 'a' and 'div' elements act as blocks */
+}
+.branch-card:hover, .pattern-card:hover, .year-filter-btn:hover {
+    box-shadow: var(--shadow-hover);
+    transform: translateY(-4px);
+}
+.card-icon-container {
+    width: 50px;
+    height: 50px;
+    background-color: var(--color-bg-light);
+    border-radius: 50%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 0 auto 10px;
+    border: 1px solid var(--color-primary);
+}
+.card-icon {
+    font-size: 24px;
+    color: var(--color-primary);
+}
+.card-title {
+    font-size: 16px;
+    font-weight: 600;
+    color: var(--color-text-dark);
+    margin-bottom: 5px;
+}
+.card-description {
+    font-size: 13px;
+    color: var(--color-text-gray);
+}
+
+/* === YEAR LINKS (Quick Filter) === */
+.year-links {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 15px;
+}
+.year-btn {
+    padding: 12px 25px;
+    font-size: 16px;
+    font-weight: 500;
+    border-radius: 30px;
+    background-color: var(--color-bg-light);
+    color: var(--color-primary);
+    border: 1px solid var(--color-primary);
+    cursor: pointer;
+    transition: all 0.2s;
+}
+.year-btn:hover, .filter-group .filter-active {
+    background-color: var(--color-accent);
+    color: white;
+    border-color: var(--color-accent);
+}
+
+/* === PAPERS DISPLAY LAYOUT & FILTERS (New) === */
+.papers-layout {
+    display: grid;
+    grid-template-columns: 1fr; /* Mobile: Single column */
+    gap: 30px;
+}
+.sidebar-filters {
+    padding: 20px;
+    border: 1px solid #eee;
+    border-radius: 8px;
+    background-color: #fcfcfc;
+}
+.sidebar-filters h3 {
+    font-size: 20px;
+    color: var(--color-primary);
+    margin-bottom: 15px;
+    padding-bottom: 8px;
+    border-bottom: 2px solid var(--color-bg-light);
+}
+.filter-group {
+    margin-bottom: 20px;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+}
+.filter-group label {
+    font-weight: 500;
+    color: var(--color-text-dark);
+    width: 100%;
+    margin-bottom: 5px;
+}
+.year-filter-btn {
+    padding: 8px 15px;
+    font-size: 14px;
+    border-top: 2px solid var(--color-primary);
+    background-color: #fff;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+.paper-list {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    gap: 20px;
+}
+.paper-item {
+    padding: 15px;
+    border: 1px solid #e0e0e0;
+    border-left: 5px solid var(--color-accent);
+    border-radius: 8px;
+    background-color: white;
+}
+.paper-subject {
+    font-weight: 600;
+    font-size: 18px;
+    color: var(--color-text-dark);
+}
+.paper-meta {
+    font-size: 12px;
+    color: var(--color-text-gray);
+    margin-bottom: 10px;
+}
+.download-btn {
+    background-color: var(--color-accent);
+    color: white;
+    padding: 8px 15px;
+    border: none;
+    border-radius: 4px;
+    font-weight: 500;
+    transition: background-color 0.2s;
+    cursor: pointer;
+    display: inline-block;
+}
+.download-btn:hover {
+    background-color: var(--color-primary);
+}
+
+/* === CONTACT FORM (New) === */
+.contact-form-container input, .contact-form-container textarea {
+    width: 100%;
+    padding: 10px;
+    margin-bottom: 15px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    font-family: inherit;
+    font-size: 16px;
+}
+.contact-form-container textarea {
+    resize: vertical;
+}
+.submit-btn {
+    background-color: var(--color-accent);
+    color: white;
+    padding: 10px 25px;
+    border: none;
+    border-radius: 4px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: background-color 0.2s;
+}
+.submit-btn:hover {
+    background-color: var(--color-primary);
+}
+
+/* === FOOTER (Existing styles maintained) === */
+footer {
+    background-color: var(--color-text-dark);
+    color: white;
+    padding: 20px 0;
+    font-size: 14px;
+}
+.footer-content {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-wrap: wrap;
+}
+/* ... (Footer social icons and other styles omitted for brevity) ... */
+
+
+/* === RESPONSIVENESS === */
+@media (min-width: 600px) {
+    .tagline { display: block; }
+    .search-btn { display: block; }
+    .papers-layout {
+        grid-template-columns: 250px 1fr; /* Desktop: Sidebar and main content */
+    }
+}
+
+@media (max-width: 768px) {
+    .nav-bar { display: none; }
+    .header-content { justify-content: center; }
+    .logo-area { text-align: center; }
+    .card-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
+    .footer-content { 
+        flex-direction: column;
+        text-align: center;
+    }
+}
\ No newline at end of file
