feat(website): expand about page (problem + founders)

Extend /about with the "why": a "the problem" section (jurisdiction vs
geography, creeping prices, lock-in, vendor sprawl) as a 2x2 pain grid, and
a "we're founders ourselves" section. Both bilingual and responsive.

Also point the footer partner link to /partners (was the homepage
#whitelabel section).

apps/website/pages/about.vue

@@ -1,14 +1,3 @@
-<style scoped>
-.about-body-grid {
-  grid-template-columns: 1.2fr 1fr;
-}
-@media (max-width: 768px) {
-  .about-body-grid {
-    grid-template-columns: 1fr;
-  }
-}
-</style>
-
 <script setup lang="ts">
 import { useTheme, useCopy } from '~/composables/useLanding'
 
@@ -18,13 +7,23 @@ const t = useTheme()
 const copy = useCopy()
 const c = computed(() => copy.value.pages.about)
 
+const eyebrow = computed(() => ({
+  fontFamily: '\'JetBrains Mono\', monospace', fontSize: '11px', color: t.value.fgDim,
+  letterSpacing: '0.12em', textTransform: 'uppercase' as const,
+}))
+const h2 = computed(() => ({
+  fontFamily: '\'Inter Tight\', sans-serif', fontWeight: 600, fontSize: 'clamp(28px, 3.6vw, 44px)',
+  letterSpacing: '-0.03em', lineHeight: 1.05, margin: '14px 0 0', color: t.value.fg, textWrap: 'balance' as const,
+}))
+
 useHead({ title: () => `${copy.value.pages.about.label} · dezky` })
 </script>
 
 <template>
   <LandingPageHeader :label="c.label" :title="c.title" :intro="c.intro" />
 
-  <LandingContainer pad="clamp(56px, 8vw, 64px) clamp(20px, 5vw, 64px) clamp(80px, 12vw, 160px)">
+  <!-- Why + principles -->
+  <LandingContainer pad="clamp(56px, 8vw, 64px) clamp(20px, 5vw, 64px) clamp(48px, 7vw, 80px)">
     <div class="about-body-grid" :style="{ display: 'grid', gap: '80px', alignItems: 'start' }">
       <div :style="{ display: 'flex', flexDirection: 'column', gap: '24px' }">
         <p
@@ -44,4 +43,54 @@ useHead({ title: () => `${copy.value.pages.about.label} · dezky` })
       </div>
     </div>
   </LandingContainer>
+
+  <!-- The problem / pain -->
+  <LandingContainer pad="0 clamp(20px, 5vw, 64px) clamp(48px, 7vw, 80px)">
+    <div :style="{ borderTop: `1px solid ${t.borderStrong}`, paddingTop: 'clamp(40px, 5vw, 56px)' }">
+      <div :style="eyebrow">{{ c.painLabel }}</div>
+      <h2 :style="h2">{{ c.painHeading }}</h2>
+      <p :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '18px', lineHeight: 1.6, color: t.fgMuted, margin: '20px 0 48px', maxWidth: '660px', textWrap: 'pretty' }">{{ c.painLede }}</p>
+
+      <div class="about-pains" :style="{ display: 'grid', gap: '1px', background: t.border, border: `1px solid ${t.border}`, borderRadius: '4px', overflow: 'hidden' }">
+        <div
+          v-for="(p, i) in c.pains" :key="i"
+          :style="{ padding: '28px', background: t.surface, display: 'flex', flexDirection: 'column', gap: '10px' }"
+        >
+          <div :style="{ fontFamily: '\'Inter Tight\', sans-serif', fontWeight: 600, fontSize: '19px', color: t.fg, letterSpacing: '-0.015em' }">{{ p[0] }}</div>
+          <p :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '15px', lineHeight: 1.6, color: t.fgMuted, margin: 0, textWrap: 'pretty' }">{{ p[1] }}</p>
+        </div>
+      </div>
+    </div>
+  </LandingContainer>
+
+  <!-- We're founders -->
+  <LandingContainer pad="0 clamp(20px, 5vw, 64px) clamp(80px, 12vw, 160px)">
+    <div :style="{ borderTop: `1px solid ${t.borderStrong}`, paddingTop: 'clamp(40px, 5vw, 56px)' }">
+      <div :style="eyebrow">{{ c.foundersLabel }}</div>
+      <h2 :style="h2">{{ c.foundersHeading }}</h2>
+      <div :style="{ display: 'flex', flexDirection: 'column', gap: '20px', marginTop: '24px', maxWidth: '720px' }">
+        <p
+          v-for="(para, i) in c.founders" :key="i"
+          :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '18px', lineHeight: 1.65, color: t.fg, margin: 0, textWrap: 'pretty' }"
+        >{{ para }}</p>
+      </div>
+    </div>
+  </LandingContainer>
 </template>
+
+<style scoped>
+.about-body-grid {
+  grid-template-columns: 1.2fr 1fr;
+}
+.about-pains {
+  grid-template-columns: 1fr 1fr;
+}
+@media (max-width: 768px) {
+  .about-body-grid {
+    grid-template-columns: 1fr;
+  }
+  .about-pains {
+    grid-template-columns: 1fr;
+  }
+}
+</style>

apps/website/utils/landingCopy.ts

@@ -146,6 +146,21 @@ export const COPY = {
           ['Åbenhed', 'Bygget på åbne standarder og open source. Ingen proprietære fælder.'],
           ['Forudsigelighed', 'Fast pris i kontraktperioden. Ingen ensidige ændringer.'],
         ],
+        painLabel: 'problemet',
+        painHeading: 'Din digitale arbejdsplads er amerikansk som standard.',
+        painLede: 'For de fleste europæiske virksomheder kører mail, filer, møder og chat gennem amerikanske hyperscalere — uanset hvilken "region" der står i indstillingerne. Det er ikke et teknisk problem. Det er et spørgsmål om kontrol.',
+        pains: [
+          ['Jurisdiktion, ikke geografi', 'En "EU-region" ændrer ikke, hvem der juridisk kan tvinges til at udlevere dine data. CLOUD Act rækker derhen, hvor moderselskabet hører hjemme.'],
+          ['Priser, der kryber', 'Licenser stiger, funktioner rykker op i dyrere niveauer, og vilkår ændres ensidigt. Du budgetterer efter en pris, du ikke selv styrer.'],
+          ['Lock-in by design', 'Proprietære formater og API\'er gør det dyrt og langsomt at flytte. Jo længere du bliver, jo sværere er det at gå.'],
+          ['Fem leverandører, fem logins', 'Mail ét sted, filer et andet, møder et tredje — fragmenteret, dyrt og svært at administrere, især for mindre teams.'],
+        ] as [string, string][],
+        foundersLabel: 'holdet',
+        foundersHeading: 'Vi er selv founders.',
+        founders: [
+          'Dezky bygges af founders — ikke af et udvalg. Vi har selv stiftet og drevet softwarevirksomheder, betalt de stigende Microsoft- og Google-regninger, svaret på kundernes compliance-spørgsmål og mærket lock-in på egen krop.',
+          'Derfor bygger vi det værktøj, vi selv manglede: én suveræn arbejdsplads med ærlig pris og uden lock-in. Vi bruger den hver dag selv — og du taler med dem, der rent faktisk bygger den, ikke et supportlag tre niveauer væk.',
+        ],
       },
       contact: {
         label: 'kontakt',
@@ -410,7 +425,7 @@ export const COPY = {
       cols: [
         ['Produkt', [['Funktioner', '/#suite'], ['Sikkerhed', '/#sovereignty'], ['Roadmap', '/roadmap'], ['Status', '/status'], ['Changelog', '/changelog']]],
         ['Selskab', [['Om os', '/about'], ['Kunder', '/customers'], ['Karriere', '/careers'], ['Presse', '/press'], ['Kontakt', '/contact']]],
-        ['Ressourcer', [['Docs', '/docs'], ['Migrationsguide', '/migration'], ['Partnere', '/#whitelabel'], ['Blog', '/blog'], ['Brand', '/brand']]],
+        ['Ressourcer', [['Docs', '/docs'], ['Migrationsguide', '/migration'], ['Partnere', '/partners'], ['Blog', '/blog'], ['Brand', '/brand']]],
         ['Juridisk', [['Privatlivspolitik', '/privacy'], ['Databehandler', '/dpa'], ['Vilkår', '/terms'], ['SLA', '/sla'], ['Cookies', '/cookies']]],
       ] as [string, [string, string][]][],
       copyright: '© 2026 Dezky ApS. Alle rettigheder forbeholdes.',
@@ -558,6 +573,21 @@ export const COPY = {
           ['Openness', 'Built on open standards and open source. No proprietary traps.'],
           ['Predictability', 'Fixed pricing for the contract term. No unilateral changes.'],
         ],
+        painLabel: 'the problem',
+        painHeading: 'Your digital workplace is American by default.',
+        painLede: 'For most European businesses, mail, files, meetings and chat run through American hyperscalers — no matter which "region" the settings say. That\'s not a technical problem. It\'s a question of control.',
+        pains: [
+          ['Jurisdiction, not geography', 'An "EU region" doesn\'t change who can legally be compelled to hand over your data. The CLOUD Act reaches to wherever the parent company is based.'],
+          ['Prices that creep', 'Licenses rise, features move into pricier tiers, and terms change unilaterally. You budget around a price you don\'t control.'],
+          ['Lock-in by design', 'Proprietary formats and APIs make leaving slow and expensive. The longer you stay, the harder it gets to go.'],
+          ['Five vendors, five logins', 'Mail in one place, files in another, meetings in a third — fragmented, costly and hard to administer, especially for smaller teams.'],
+        ] as [string, string][],
+        foundersLabel: 'the team',
+        foundersHeading: 'We\'re founders ourselves.',
+        founders: [
+          'Dezky is built by founders — not by a committee. We\'ve started and run software companies ourselves, paid the rising Microsoft and Google bills, answered customers\' compliance questions, and felt lock-in first-hand.',
+          'So we\'re building the tool we wished we had: one sovereign workplace with honest pricing and no lock-in. We use it every day ourselves — and you talk to the people actually building it, not a support layer three levels away.',
+        ],
       },
       contact: {
         label: 'contact',
@@ -822,7 +852,7 @@ export const COPY = {
       cols: [
         ['Product', [['Features', '/#suite'], ['Security', '/#sovereignty'], ['Roadmap', '/roadmap'], ['Status', '/status'], ['Changelog', '/changelog']]],
         ['Company', [['About', '/about'], ['Customers', '/customers'], ['Careers', '/careers'], ['Press', '/press'], ['Contact', '/contact']]],
-        ['Resources', [['Docs', '/docs'], ['Migration guide', '/migration'], ['Partners', '/#whitelabel'], ['Blog', '/blog'], ['Brand', '/brand']]],
+        ['Resources', [['Docs', '/docs'], ['Migration guide', '/migration'], ['Partners', '/partners'], ['Blog', '/blog'], ['Brand', '/brand']]],
         ['Legal', [['Privacy', '/privacy'], ['DPA', '/dpa'], ['Terms', '/terms'], ['SLA', '/sla'], ['Cookies', '/cookies']]],
       ] as [string, [string, string][]][],
       copyright: '© 2026 Dezky ApS. All rights reserved.',