style1

Author: Aditya Putatunda

index.html

@@ -59,8 +59,9 @@
   .news-blurb { font-size: 0.82rem; color: var(--text-muted); line-height: 1.55; }
 
   /* Research */
-  .page-intro { max-width: 1400px; margin: 0 auto; padding: 3.5rem 3rem 2.5rem; }
-  .page-intro h1 { font-family: var(--serif); font-size: 2.2rem; font-weight: 300; letter-spacing: -0.02em; margin-bottom: 0.75rem; }
+  .page-intro { max-width: 1400px; margin: 0 auto; padding: 3rem 3rem 1rem; }
+  .page-intro-inner { padding-bottom: 0.9rem; border-bottom: 1px solid var(--border); }
+  .page-intro h1 { font-family: var(--serif); font-size: 2.2rem; font-weight: 300; letter-spacing: -0.02em; margin-bottom: 0.6rem; }
   .page-intro p { font-size: 0.92rem; color: var(--text-muted); line-height: 1.7; max-width: 960px; }
   .sections-overview { max-width: 1400px; margin: 0 auto; padding: 0 3rem 2rem; display: grid; grid-template-columns: 1fr 1fr 1fr; column-gap: 2rem; row-gap: 0; }
   .section-panel { padding: 1.75rem 0; cursor: pointer; transition: opacity 0.35s ease, border-color 0.35s ease; position: relative; border-top: 2px solid var(--text); }
@@ -148,10 +149,9 @@
 
   /* Misc page sections */
   .misc-page { max-width: 1400px; margin: 0 auto; padding: 0 3rem 3rem; }
-  .misc-section { margin-top: 3.5rem; }
-  .misc-section:first-child { margin-top: 1rem; }
-  .misc-section-title { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; letter-spacing: -0.01em; margin-bottom: 1.5rem; position: relative; display: inline-block; }
-  .misc-section-title::after { content: ''; position: absolute; left: 0; bottom: -0.55rem; width: 32px; height: 2px; background: var(--accent); }
+  .misc-section { margin-top: 2.5rem; }
+  .misc-section:first-child { margin-top: 0.5rem; }
+  .misc-section-title { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; letter-spacing: -0.01em; padding-bottom: 0.7rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); }
   .misc-section .talks-list, .misc-section .repo-list { padding: 0; }
   .misc-section .talk-item:first-child { border-top: none; padding-top: 0.7rem; }
 
@@ -344,12 +344,12 @@ <h2>${sec.title}</h2>
   });
 
   $('#tab-research').innerHTML = `
-    <div class="page-intro"><h1>Research</h1><p>${D.research.intro}</p></div>
+    <div class="page-intro"><div class="page-intro-inner"><h1>Research</h1><p>${D.research.intro}</p></div></div>
     <div class="sections-overview">${panels}${drawers}</div>`;
 
   // PUBLICATIONS
   $('#tab-publications').innerHTML = `
-    <div class="page-intro"><h1>Publications</h1><p>${D.publications.intro}</p></div>
+    <div class="page-intro"><div class="page-intro-inner"><h1>Publications</h1><p>${D.publications.intro}</p></div></div>
     <div class="publications-list">
       ${D.publications.items.map((p, i) => `
         <div class="pub-item" style="animation-delay:${0.05 + i * 0.05}s">
@@ -365,7 +365,7 @@ <h2>${sec.title}</h2>
 
   // ABOUT
   $('#tab-about').innerHTML = `
-    <div class="page-intro"><h1>About</h1></div>
+    <div class="page-intro"><div class="page-intro-inner"><h1>About</h1></div></div>
     <div class="about-content">
       <div class="about-prose">${D.about.prose.map(p => `<p>${p}</p>`).join('')}</div>
       <div class="about-sidebar">
@@ -438,7 +438,7 @@ <h2>${sec.title}</h2>
   const talksHTML = D.talks.items.map((t, i) => talkRow(t, i, i >= PREVIEW)).join('');
 
   $('#tab-misc').innerHTML = `
-    <div class="page-intro"><h1>Miscellaneous</h1></div>
+    <div class="page-intro"><div class="page-intro-inner"><h1>Miscellaneous</h1></div></div>
     <div class="misc-page">
       ${repoHTML ? `
       <div class="misc-section">
@@ -454,7 +454,7 @@ <h2 class="misc-section-title">Talks &amp; Presentations</h2>
 
   // CONTACT
   $('#tab-contact').innerHTML = `
-    <div class="page-intro"><h1>Contact</h1><p>${D.contact.intro}</p></div>
+    <div class="page-intro"><div class="page-intro-inner"><h1>Contact</h1><p>${D.contact.intro}</p></div></div>
     <div class="contact-content">
       <div>
         ${D.contact.emails.map(e => `<div class="contact-block"><div class="contact-label">${e.label}</div><div class="contact-value">${e.address}</div></div>`).join('')}