feat(site): rework 19 marketing showcases for composition diversity

Measured convergence before: split hero 13/19, top-bar nav 19/19,
one-line notice footer 14/19, body Pretendard 17/21, 10 similarity
pairs above 0.78. Each showcase got a pre-assigned hero family, nav
form, footer form, type pair, background, accent hue, radius, motion
grammar and material from outputs/rework-2026-10-06/plan.md; direction
cards and the chosen reason are recorded in every design.md.

After: 0 similarity warnings, 19 distinct display faces, 7 hero
families, 5 nav forms, 5 footer forms, no scroll reveals, 5 showcases
with SVG filter materials. Example contact values replace bracket
placeholders under the existing fictional-brand notices. Thumbnails,
OG images, card copy and three e2e assertions updated; dead CSS in
dure-enrollment and hannam-jari removed; similarity.mjs learns the new
font families.

apps/site/public/work/griddle-club/scripts/franchise.js

@@ -140,7 +140,7 @@
       return;
     }
     const pyeong = Math.round((squareMeters / 3.3058) * 10) / 10;
-    areaOutput.textContent = `${squareMeters.toLocaleString("ko-KR")}㎡ · 약 ${pyeong.toLocaleString("ko-KR")}평`;
+    areaOutput.textContent = `${squareMeters.toLocaleString("ko-KR")}㎡, 약 ${pyeong.toLocaleString("ko-KR")}평`;
   };
 
   const validateStepTwo = () => {
@@ -172,7 +172,7 @@
   const reviewValues = () => {
     const squareMeters = Number(getInputValue("exclusiveArea"));
     const areaLabel = requiresArea() && squareMeters > 0
-      ? `${squareMeters.toLocaleString("ko-KR")}㎡ · 약 ${(Math.round((squareMeters / 3.3058) * 10) / 10).toLocaleString("ko-KR")}평`
+      ? `${squareMeters.toLocaleString("ko-KR")}㎡, 약 ${(Math.round((squareMeters / 3.3058) * 10) / 10).toLocaleString("ko-KR")}평`
       : "해당 없음";
     const values = {
       demoName: getInputValue("demoName"),