UI: unify H1 size, eyebrow style, card radius and hover transform

Visual consistency pass so every page feels familiar.

H1 token (clamp(34px, 4vw, 56px) / line-height 1.05 / letter-spacing
-0.04em):
- typography.css: hero H1 was 50.2px fixed (with 40px/38px breakpoints).
- BookingPage: was clamp(32px, 4vw, 52px).
Service-, About-, Pricing-, Legal-page H1s already matched.

Shared .eyebrow utility (typography.css):
- 13px, green, uppercase, 700, 0.08em letter-spacing.
- Replaces the bespoke .service-eyebrow (14px) and .instagram-kicker
  (11px green pill).
- The yellow 28px .service-highlight-eyebrow now inherits the same
  utility — the eyebrow line is no longer competing with the H2
  underneath. Local rule kept only for the bottom-margin override.

Card border-radius unified to 28px:
- sections.css .service-card: 20px → 28px
- sections.css .value-card: 16px → 28px
- sections.css .testimonial-card: 20px → 28px
- TestimonialsSection .testimonial-stage: 24px → 28px
- AboutPage .about-section-gradient + .about-contact-card: 36px → 28px
- LegalPage .legal-card: 32px → 28px (mobile 24px → 28px)
- InstagramSection .instagram-panel: 24px → 28px
- PricingPage .meet-greet-prompt: 24px → 28px (mobile 20px → 28px)
Modal dialogs left at 24px (different visual class — overlay, not
inline content card).

Card hover transform unified to translateY(-6px) scale(1.012):
- sections.css .service-card: -6px / 1.01 → 1.012
- sections.css .value-card: -5px (no scale) → -6px / 1.012
- sections.css .testimonial-card: -4px (no scale) → -6px / 1.012
- ServiceLandingPage .service-plan-card / .service-benefit-card:
  -8px → -6px
- PricingPage .pricing-plan-card: -8px → -6px
- ServiceLandingPage .service-related-card already -6px / 1.012.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

src/lib/styles/sections.css

@@ -249,7 +249,7 @@ section {
 
 .service-card {
   background: var(--off-white);
-  border-radius: 20px;
+  border-radius: 28px;
   padding: 40px 32px;
   text-align: center;
   transition:
@@ -280,7 +280,7 @@ section {
 
 @media (hover: hover) {
   .service-card:hover {
-    transform: translateY(-6px) scale(1.01);
+    transform: translateY(-6px) scale(1.012);
     box-shadow: 0 18px 38px rgba(0, 0, 0, 0.1);
   }
 }
@@ -355,7 +355,7 @@ footer {
 
 .value-card {
   background: rgba(255, 255, 255, 0.07);
-  border-radius: 16px;
+  border-radius: 28px;
   padding: 32px 28px;
   border: 1px solid rgba(255, 255, 255, 0.12);
   transition:
@@ -366,7 +366,7 @@ footer {
 
 @media (hover: hover) {
   .value-card:hover {
-    transform: translateY(-5px);
+    transform: translateY(-6px) scale(1.012);
     box-shadow: 0 18px 34px rgba(0, 0, 0, 0.14);
     border-color: rgba(255, 255, 255, 0.18);
   }
@@ -390,7 +390,7 @@ footer {
 
 .testimonial-card {
   background: #fff;
-  border-radius: 20px;
+  border-radius: 28px;
   padding: 36px 32px;
   box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
   transition:
@@ -400,7 +400,7 @@ footer {
 
 @media (hover: hover) {
   .testimonial-card:hover {
-    transform: translateY(-4px);
+    transform: translateY(-6px) scale(1.012);
     box-shadow: 0 18px 34px rgba(0, 0, 0, 0.09);
   }
 }