Merge p12-w3-about-photos into dev (bio portraits, image swaps, circular framing, pull-quote width)

DeepDrftPublic.Client/Pages/About.razor

@@ -94,11 +94,11 @@
                                            Image2="@member.PortraitImage2"
                                            Alt1="@($"{member.Name} — portrait")"
                                            NaturalWidth="1365"
-                                           NaturalHeight="2048"
-                                           WindowHeightFraction="0.62"
+                                           NaturalHeight="1365"
+                                           WindowHeightFraction="1.0"
                                            ImageHeight="auto"
                                            ImageWidth="100%"
-                                           ParallaxSpeed="0.5" />
+                                           ParallaxSpeed="0.3" />
                         }
                         else
                         {
@@ -180,8 +180,8 @@
         @* IMG SLOT D — hands-on-gear inset, the literal proof-of-effort image,
            captioned in the rail rather than run full-bleed. *@
         <figure class="movement-figure">
-            <ParallaxImage Image1="img/mixer-bw.jpg"
-                           Image2="img/mixer.jpg"
+            <ParallaxImage Image1="img/dd-mixer-2-bw.jpeg"
+                           Image2="img/dd-mixer-2.jpg"
                            Alt1="Deep DRFT — hands on the gear"
                            NaturalWidth="2048"
                            NaturalHeight="1365"
@@ -353,10 +353,14 @@
         new(
             Name: "Khabran Peters",
             Role: "Production · Sound Design · Live",
-            Bio: null),
+            Bio: null,
+            PortraitImage1: "img/dd-khabran-bw.jpeg",
+            PortraitImage2: "img/dd-khabran.jpeg"),
         new(
             Name: "Daniel Harvey",
             Role: "Production · Sound Design · Live",
-            Bio: "Daniel started on drums at ten and embarked in electronic music at seventeen — synthesizers first. A metalhead at from a young age, he spent ten years as an engineer living near Detroit filling the nights with synthesized tones and rhythms, shaped most of all by modern underground Detroit techno. Art & engineering cannot be separated: custom plugins, hardware recording & performance rigs, the tools behind the tracks are just as important as the finished sound. To him the science and the math matter as much as the beauty — tension and release, built deliberately."),
+            Bio: "Daniel started on drums at ten and embarked in electronic music at seventeen — synthesizers first. A metalhead at from a young age, he spent ten years as an engineer living near Detroit filling the nights with synthesized tones and rhythms, shaped most of all by modern underground Detroit techno. Art & engineering cannot be separated: custom plugins, hardware recording & performance rigs, the tools behind the tracks are just as important as the finished sound. To him the science and the math matter as much as the beauty — tension and release, built deliberately.",
+            PortraitImage1: "img/dd-daniel-bw.jpeg",
+            PortraitImage2: "img/dd-daniel.jpeg"),
     ];
 }

DeepDrftPublic.Client/Pages/About.razor.css

@@ -272,16 +272,17 @@
 
 .bio-portrait {
     width: 100%;
+    aspect-ratio: 1 / 1;
     overflow: hidden;
     border: 1px solid var(--deepdrft-border);
+    border-radius: 50%;
 }
 
 /* Graceful-degrade slot shown until a portrait file lands. A flat tonal panel in
-   the navy family with the site's portrait aspect precedent (1365×2048). */
+   the navy family, matching the circular portrait frame. */
 .bio-portrait-placeholder {
     width: 100%;
-    aspect-ratio: 1365 / 2048;
-    max-height: 56vh;
+    aspect-ratio: 1 / 1;
     background:
         linear-gradient(160deg,
             color-mix(in srgb, var(--deepdrft-navy) 8%, var(--deepdrft-white)) 0%,
@@ -480,7 +481,7 @@
 .pull-quote {
     margin: 0;
     margin-left: -7rem;
-    max-width: 22ch;
+    max-width: 44ch;
 }
 
 .pull-eyebrow {

DeepDrftPublic.Client/Pages/Home.razor

@@ -144,10 +144,10 @@
 
         <MudItem xs="12" md="6">
             <div class="split-right">
-                <ParallaxImage Image1="img/kp-shoulder-bw.jpeg"
+                <ParallaxImage Image1="img/dd-pedals.jpeg"
                                InvertDirection
-                               NaturalWidth="1365"
-                               NaturalHeight="2048"
+                               NaturalWidth="1159"
+                               NaturalHeight="1196"
                                WindowHeightFraction="0.5"
                                ImageHeight="auto"
                                ImageWidth="100%"