Refine mobile layout updates

app/portfolio.css

@@ -247,6 +247,7 @@
   .type-hero-title {
     font-size: var(--text-hero-title);
     line-height: 1.08;
+    text-wrap: balance;
   }
 
   .navbar-brand-mobile {
@@ -255,16 +256,6 @@
     text-overflow: ellipsis;
   }
 
-  .hero-title-mobile-lines {
-    display: flex;
-    flex-direction: column;
-    gap: 0.08em;
-  }
-
-  .hero-title-mobile-lines span {
-    display: block;
-  }
-
   @media (min-width: 1024px) {
     .type-hero-title-latin {
       font-size: var(--text-hero-title-latin);
@@ -396,6 +387,14 @@
     box-shadow: var(--button-secondary-shadow);
   }
 
+  .hero-action-link {
+    min-width: 210px;
+    min-height: 58px;
+    padding: 0.95rem 1.6rem;
+    font-size: 16px;
+    line-height: 1.2;
+  }
+
   .display-face {
     font-family: var(--font-display), serif;
   }
@@ -685,6 +684,11 @@
       flex: 1 1 auto;
     }
 
+    .navbar-brand-mobile {
+      line-height: 1.12;
+      margin-bottom: 0.35rem;
+    }
+
     .navbar-logo-shell {
       padding: 0.45rem;
       border-radius: 18px;
@@ -733,12 +737,14 @@
 
     .navbar-specialty {
       display: block;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
+      white-space: normal;
+      overflow: visible;
+      text-overflow: clip;
       font-size: 11px;
-      letter-spacing: 0.06em;
-      line-height: 1.35;
+      letter-spacing: 0.04em;
+      line-height: 1.4;
+      text-wrap: pretty;
+      margin-top: 0;
     }
 
     .type-page-title {
@@ -771,6 +777,18 @@
       padding: 1.25rem 1rem;
     }
 
+    .hero-action-group {
+      justify-content: flex-start;
+      gap: 0.75rem;
+    }
+
+    .hero-action-link {
+      min-width: 170px;
+      min-height: 46px;
+      padding: 0.7rem 1rem;
+      font-size: 13px;
+    }
+
     .line-frame::before,
     .line-frame::after {
       height: 56px;
@@ -779,6 +797,25 @@
   }
 
   @media (max-width: 430px) {
+    .navbar-brand-lockup {
+      align-items: flex-start;
+    }
+
+    .navbar-brand-copy {
+      min-width: 0;
+      padding-top: 0.15rem;
+    }
+
+    .navbar-brand-mobile {
+      margin-bottom: 0.45rem;
+    }
+
+    .navbar-specialty {
+      max-width: 100%;
+      font-size: 10.5px;
+      line-height: 1.45;
+    }
+
     .type-hero-title {
       font-size: clamp(30px, 11.5vw, 40px);
       line-height: 1.02;
@@ -799,16 +836,16 @@
 
     .hero-action-group {
       display: flex;
-      flex-direction: column;
+      flex-direction: row;
+      justify-content: flex-start;
       align-items: flex-start;
+      flex-wrap: wrap;
       gap: 0.75rem;
     }
 
     .hero-action-group > * {
       width: auto;
-      min-width: min(100%, 13.5rem);
-      padding: 0.8rem 1.35rem;
-      font-size: 13px;
+      min-width: 150px;
     }
   }
 
@@ -826,6 +863,11 @@
       font-size: clamp(18px, 5.8vw, 22px);
     }
 
+    .navbar-specialty {
+      font-size: 10px;
+      letter-spacing: 0.03em;
+    }
+
     .contact-card {
       padding: 1rem 0.875rem;
     }