feat: team section on the blog with Ryad Gazenay and Mehdi Azouz, GitHub and LinkedIn links, optimized photos

blog/index.html

@@ -297,6 +297,37 @@ td strong { color: #fff; font-weight: 600; }
 .reveal.in { opacity: 1; transform: none; }
 @media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; } }
 
+/* team */
+.team { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin: 2.4em 0 !important; }
+@media (max-width: 620px) { .team { grid-template-columns: 1fr; } }
+.member {
+  position: relative; background: var(--bg-raise); border: 1px solid var(--line);
+  border-radius: 18px; overflow: hidden; transition: border-color .3s, transform .3s;
+}
+.member:hover { border-color: var(--line-hot); transform: translateY(-5px); }
+.member-photo { position: relative; aspect-ratio: 1; overflow: hidden; }
+.member-photo img {
+  width: 100%; height: 100%; object-fit: cover; display: block;
+  filter: saturate(.85); transition: transform .6s cubic-bezier(.22,1,.36,1), filter .4s;
+}
+.member:hover .member-photo img { transform: scale(1.05); filter: saturate(1.05); }
+.member-photo::after {
+  content: ''; position: absolute; inset: 0;
+  background: linear-gradient(to top, var(--bg-raise) 0%, transparent 36%);
+}
+.member-info { padding: 6px 26px 26px; }
+.member-info .role { font-family: var(--mono); font-size: .7rem; letter-spacing: 2.5px; text-transform: uppercase; color: var(--cyan); display: block; margin-bottom: 8px; }
+.member-info h4 { font-family: var(--display); font-weight: 700; font-size: 1.35rem; letter-spacing: -0.5px; color: #fff; margin-bottom: 16px; }
+.member-links { display: flex; gap: 10px; }
+.member-links a {
+  display: inline-flex; align-items: center; gap: 8px;
+  font-family: var(--mono); font-size: .76rem; letter-spacing: 1px;
+  color: var(--dim); border: 1px solid var(--line); border-radius: 50px;
+  padding: 8px 16px; transition: color .25s, border-color .25s, background .25s;
+}
+.member-links a:hover { color: #fff; border-color: var(--line-hot); background: rgba(124,58,237,0.08); }
+.member-links svg { width: 15px; height: 15px; fill: currentColor; flex-shrink: 0; }
+
 /* ============ CTA ============ */
 .cta { position: relative; z-index: 1; max-width: 1060px; margin: 110px auto 0; padding: 0 28px; }
 .cta-inner {
@@ -519,6 +550,51 @@ footer { position: relative; z-index: 1; max-width: 1060px; margin: 0 auto; padd
     </table>
   </div>
 
+  <section class="chapter reveal" id="team">
+    <span class="ghost" aria-hidden="true">05</span>
+    <span class="kicker">Chapter 05</span>
+    <h2>The team</h2>
+  </section>
+
+  <p class="reveal">PaperProf was built by two EPITA students who spent ten days arguing with Gradio so you don't have to.</p>
+
+  <div class="team reveal">
+    <article class="member">
+      <div class="member-photo"><img src="assets/ryad.jpg" alt="Portrait of Ryad Gazenay" loading="lazy" width="640" height="640"></div>
+      <div class="member-info">
+        <span class="role">Co-creator</span>
+        <h4>Ryad Gazenay</h4>
+        <div class="member-links">
+          <a href="https://github.com/ryadg-kura" target="_blank" rel="noopener" aria-label="Ryad Gazenay on GitHub">
+            <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8z"/></svg>
+            GitHub
+          </a>
+          <a href="https://www.linkedin.com/in/ryad-gazenay/" target="_blank" rel="noopener" aria-label="Ryad Gazenay on LinkedIn">
+            <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M14.5 0h-13C.67 0 0 .67 0 1.5v13c0 .83.67 1.5 1.5 1.5h13c.83 0 1.5-.67 1.5-1.5v-13c0-.83-.67-1.5-1.5-1.5zM4.74 13.64H2.38V6.04h2.36v7.6zM3.56 5c-.76 0-1.37-.62-1.37-1.38S2.8 2.25 3.56 2.25s1.37.62 1.37 1.37S4.32 5 3.56 5zm10.08 8.64h-2.36V9.94c0-.88-.02-2.02-1.23-2.02-1.23 0-1.42.96-1.42 1.95v3.77H6.27V6.04h2.27v1.04h.03c.32-.6 1.09-1.23 2.24-1.23 2.39 0 2.83 1.57 2.83 3.62v4.17z"/></svg>
+            LinkedIn
+          </a>
+        </div>
+      </div>
+    </article>
+    <article class="member">
+      <div class="member-photo"><img src="assets/mehdi.jpg" alt="Portrait of Mehdi Azouz" loading="lazy" width="640" height="640"></div>
+      <div class="member-info">
+        <span class="role">Co-creator</span>
+        <h4>Mehdi Azouz</h4>
+        <div class="member-links">
+          <a href="https://github.com/gitmehdii" target="_blank" rel="noopener" aria-label="Mehdi Azouz on GitHub">
+            <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8z"/></svg>
+            GitHub
+          </a>
+          <a href="https://www.linkedin.com/in/mehdi-azouz-b3b537300/" target="_blank" rel="noopener" aria-label="Mehdi Azouz on LinkedIn">
+            <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M14.5 0h-13C.67 0 0 .67 0 1.5v13c0 .83.67 1.5 1.5 1.5h13c.83 0 1.5-.67 1.5-1.5v-13c0-.83-.67-1.5-1.5-1.5zM4.74 13.64H2.38V6.04h2.36v7.6zM3.56 5c-.76 0-1.37-.62-1.37-1.38S2.8 2.25 3.56 2.25s1.37.62 1.37 1.37S4.32 5 3.56 5zm10.08 8.64h-2.36V9.94c0-.88-.02-2.02-1.23-2.02-1.23 0-1.42.96-1.42 1.95v3.77H6.27V6.04h2.27v1.04h.03c.32-.6 1.09-1.23 2.24-1.23 2.39 0 2.83 1.57 2.83 3.62v4.17z"/></svg>
+            LinkedIn
+          </a>
+        </div>
+      </div>
+    </article>
+  </div>
+
 </main>
 
 <section class="cta">