Update CV references and enhance hero section layout: Rename CV file to "CV_SOFT.pdf", adjust stats formatting, and improve responsive design for hero component.

Author: Bardakor

README.md

@@ -20,7 +20,7 @@ Static assets live in `public/`:
 
 - `liam-portrait-white.jpg`
 - `liam-portrait-black.jpg`
-- `CV_SIA.pdf`
+- `CV_SOFT.pdf`
 - `CV_SOFT_EN.pdf`
 - `Memoire_Liam_Abourousse.pdf`
 - `og-image.jpg`

content.json

@@ -13,8 +13,8 @@
     "portrait_alt": "Portrait of Liam Abourousse in a white shirt against a light wall",
     "stats": [
       {
-        "num": "#1",
-        "label": "KPMG HACKATHON · 2026",
+        "num": "#1 KPMG",
+        "label": "HACKATHON — 2026",
         "sublabel": "Won against 100+ teams · 350 engineering students"
       }
     ]
@@ -143,7 +143,7 @@
     {
       "kind": "CV FR",
       "title": "SOFTWARE, DATA & AI ENGINEER — PYTHON, GENAI & DATA PRODUCTS",
-      "href": "CV_SIA.pdf"
+      "href": "CV_SOFT.pdf"
     },
     {
       "kind": "GITHUB",

index.html

@@ -17,7 +17,7 @@
   <link data-trunk rel="copy-file" href="public/og-image.jpg" />
   <link data-trunk rel="copy-file" href="public/liam-portrait-white.jpg" />
   <link data-trunk rel="copy-file" href="public/liam-portrait-black.jpg" />
-  <link data-trunk rel="copy-file" href="public/CV_SIA.pdf" />
+  <link data-trunk rel="copy-file" href="public/CV_SOFT.pdf" />
   <link data-trunk rel="copy-file" href="public/CV_SOFT_EN.pdf" />
   <link data-trunk rel="copy-file" href="public/Memoire_Liam_Abourousse.pdf" />
   <link data-trunk rel="copy-file" href="public/robots.txt" />

public/CV_SIA.pdf

@@ -9,19 +9,19 @@ pub fn Hero() -> impl IntoView {
     let h = c.hero;
     let stats = h.stats.clone();
     view! {
-        <section class="hero-section grid grid-cols-1 md:grid-cols-12 border-b">
-            <div class="hidden md:flex md:col-span-2 p-[clamp(16px,2.5vw,32px)] flex-col justify-center border-r">
+        <section class="hero-section grid grid-cols-1 lg:grid-cols-12 border-b">
+            <div class="hidden lg:flex lg:col-span-2 p-[clamp(16px,2.5vw,32px)] flex-col justify-center border-r">
                 <p class="font-sans text-[0.6rem] font-medium tracking-normal uppercase text-muted [writing-mode:vertical-rl] [text-orientation:mixed]">{c.meta.edition}</p>
             </div>
-            <div class="col-span-full md:col-span-6 min-w-0 p-[clamp(32px,5vw,80px)] flex flex-col justify-center border-r">
-                <h1 class="hero-title font-serif text-[clamp(2rem,8.5vw,7.5rem)] font-black leading-[0.95] tracking-normal">
+            <div class="hero-copy col-span-full lg:col-span-6 min-w-0 p-[clamp(32px,5vw,80px)] flex flex-col justify-center border-r">
+                <h1 class="hero-title font-serif font-black leading-[0.95] tracking-normal">
                     <span class="line">{h.headline_1}</span>
                     <span class="line italic">{h.headline_2}</span>
                 </h1>
                 <p class="hero-body text-[clamp(0.85rem,1.1vw,1rem)] leading-[1.7] text-muted max-w-[560px] mt-7">{h.body}</p>
             </div>
-            <div class="col-span-full md:col-span-4 flex flex-col min-h-0">
-                <figure class="portrait-panel relative flex-1 min-h-[360px] md:min-h-[420px] border-b overflow-hidden bg-bg-dark">
+            <div class="col-span-full lg:col-span-4 flex flex-col min-h-0">
+                <figure class="portrait-panel relative flex-1 min-h-[360px] lg:min-h-[420px] border-b overflow-hidden bg-bg-dark">
                     <img
                         src=h.portrait
                         alt=h.portrait_alt
@@ -38,10 +38,9 @@ pub fn Hero() -> impl IntoView {
                         let has_sub = !s.sublabel.is_empty();
                         view! {
                             <div class="stat-block flex flex-col justify-center gap-2 p-[clamp(16px,2.5vw,32px)]">
-                                <p class="font-serif text-[clamp(2rem,4vw,3.2rem)] font-black text-red leading-[0.9] tracking-normal">
-                                    <span class="whitespace-nowrap">{s.num}</span>
-                                    " "
-                                    {s.label}
+                                <p class="stat-headline font-serif font-black text-red tracking-normal">
+                                    <span class="stat-line">{s.num}</span>
+                                    <span class="stat-line">{s.label}</span>
                                 </p>
                                 {has_sub.then(|| view! {
                                     <span class="text-[0.55rem] tracking-normal text-muted/80 normal-case leading-snug">{s.sublabel}</span>

public/CV_SOFT.pdf

@@ -81,14 +81,26 @@
 }
 
 /* ── HERO LINE (GSAP initial state) ────────────── */
+.hero-copy {
+  container-type: inline-size;
+  container-name: hero-copy;
+}
+
 .hero-title {
   max-width: 100%;
 }
 
+.hero-section .hero-title {
+  font-size: clamp(2.15rem, 6.8vw, 6.25rem);
+  font-size: clamp(2.15rem, 13cqi, 6.25rem);
+}
+
 .hero-title .line {
   display: block;
   overflow: hidden;
-  padding-right: 0.2em;
+  white-space: nowrap;
+  padding: 0.08em 0.2em 0.12em 0;
+  margin: -0.08em 0 -0.12em;
   opacity: 0;
   transform: translateY(50px);
 }
@@ -148,7 +160,7 @@
   padding-bottom: calc(clamp(32px, 5vw, 80px) + var(--half-empty-ticker-space));
 }
 
-@media (min-width: 768px) {
+@media (min-width: 1024px) {
   .ticker-wrap-empty + .hero-section .portrait-panel {
     min-height: calc(420px + var(--empty-ticker-space));
   }
@@ -278,9 +290,22 @@
 }
 
 .hero-stats .stat-block {
+  container-type: inline-size;
   background: var(--color-bg);
 }
 
+.hero-stats .stat-headline {
+  font-size: clamp(1.2rem, 3.6vw, 2.5rem);
+  font-size: clamp(1.2rem, 9.3cqi, 2.5rem);
+  line-height: 0.95;
+  letter-spacing: -0.02em;
+}
+
+.hero-stats .stat-line {
+  display: block;
+  white-space: nowrap;
+}
+
 /* ── SKILLS GRID CONTINUITY ────────────────────── */
 .skills-grid .skill-bucket {
   border-right: 1px solid var(--color-border, rgba(20, 20, 18, 0.12));