feat(typography): texto corrido em sans 16px; mono so em rotulos, tags e metadados

- --font-body (Space Grotesk) aplicado a p/li/dd de main e footer com :where() (especificidade zero)
- rotulos (.ds-eyebrow, .ds-kicker, .ds-tag, .ds-metric, .quality-*) seguem em Geist Mono
- .ds-copy 16px/1.6, descricoes e listas 15px/1.7 (celular deixa de usar 13px)
- cards de servicos (WorkModalities) em sans

Co-Authored-By: Claude Sonnet 5.5 <[email protected]>

app/components/WorkModalities.tsx

@@ -165,7 +165,7 @@ function TierCard({ tier }: Readonly<{ tier: Tier }>) {
         <div className="font-display text-[clamp(17px,4.6vw,18px)] font-extrabold leading-none tracking-tight">
           {tier.pricing}
         </div>
-        <div className="text-[12px] leading-[1.7] text-[var(--meta)]">
+        <div className="font-display text-[12px] leading-[1.7] text-[var(--meta)]">
           {tier.pricingNote}
         </div>
       </div>
@@ -253,10 +253,10 @@ export function WorkModalities() {
               href={service.href}
               className="min-w-0 rounded-[8px] border border-[var(--border)] bg-white/70 px-sp-4 py-sp-4 transition-colors duration-200 hover:border-[var(--slash)] hover:bg-white"
             >
-              <div className="text-base font-semibold leading-snug text-[var(--ink)]">
+              <div className="font-display text-base font-semibold leading-snug text-[var(--ink)]">
                 {service.label}
               </div>
-              <div className="mt-sp-2 text-sm leading-6 text-[var(--ink-80)]">
+              <div className="mt-sp-2 font-display text-sm leading-6 text-[var(--ink-80)]">
                 {service.description}
               </div>
             </Link>

app/globals.css

@@ -55,6 +55,7 @@
   --font-display: var(--font-space-grotesk), sans-serif;
   --font-hero: var(--font-monument-extended), sans-serif;
   --font-mono: var(--font-geist-mono), monospace;
+  --font-body: var(--font-display);
   --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
   --ease-in: cubic-bezier(0.4, 0, 1, 1);
 }
@@ -197,6 +198,24 @@ svg {
   max-width: 100%;
 }
 
+/* Texto corrido em sans (leitura); a monoespacada fica nos rotulos, tags e metadados.
+   :where() mantem especificidade zero: classes de componente e utilitarios continuam mandando. */
+:where(main, footer) :where(p, li, dd) {
+  font-family: var(--font-body);
+}
+
+:where(
+    .ds-eyebrow,
+    .ds-kicker,
+    .ds-tag,
+    .ds-metric,
+    .quality-code,
+    .quality-hint,
+    .quality-disclaimer
+  ) {
+  font-family: var(--font-mono);
+}
+
 @supports (overflow: clip) {
   html,
   body {
@@ -326,8 +345,8 @@ textarea {
 .ds-section-description {
   max-width: 58ch;
   color: rgba(10, 10, 10, 0.74);
-  font-size: 14px;
+  font-size: 15px;
-  line-height: 1.82;
+  line-height: 1.7;
 }
 
 .ds-grid-2,
@@ -382,8 +401,8 @@ textarea {
 .ds-copy {
   margin-top: var(--sp-4);
   color: var(--ink-80);
-  font-size: 14px;
+  font-size: 16px;
-  line-height: 1.8;
+  line-height: 1.6;
   flex-grow: 1;
 }
 
@@ -497,8 +516,8 @@ textarea {
 .ds-list {
   margin-top: var(--sp-5);
   padding-left: 18px;
-  font-size: 14px;
+  font-size: 15px;
-  line-height: 1.85;
+  line-height: 1.7;
   flex-grow: 1;
 }
 
@@ -800,8 +819,8 @@ textarea {
   .ds-section-description,
   .ds-copy,
   .ds-list {
-    font-size: 13px;
+    font-size: 15px;
-    line-height: 1.75;
+    line-height: 1.65;
   }
 
   .ds-tags {