From 97728cb09e447c47df31669fa6b15fbc8099f768 Mon Sep 17 00:00:00 2001
From: Ronni Baslund <rhb@vdoc.dk>
Date: Sat, 6 Jun 2026 16:47:47 +0200
Subject: [PATCH] feat(website): SLA & cookie policy pages

Replace the /sla and /cookies stubs with real pages (da + en), matching
the DPA/terms/privacy layout. Drop both from the [slug].vue stub map.

- SLA: 99% uptime target framed as a transparency-backed commitment (no
  public service credits); contractual credits offered only via Enterprise
  agreements. Support first-response targets table; status-page reference.
- Cookie policy: strictly-necessary + language preference only, cookie-free
  analytics (Umami), no third-party tracking, "no banner needed"; cookie
  table; final (v1.0), no draft banner.
---
 apps/website/pages/[slug].vue     |   2 -
 apps/website/pages/cookies.vue    |  73 +++++++++++++++++++++
 apps/website/pages/sla.vue        |  64 +++++++++++++++++++
 apps/website/utils/landingCopy.ts | 102 ++++++++++++++++++++++++++++++
 4 files changed, 239 insertions(+), 2 deletions(-)
 create mode 100644 apps/website/pages/cookies.vue
 create mode 100644 apps/website/pages/sla.vue

diff --git a/apps/website/pages/[slug].vue b/apps/website/pages/[slug].vue
index 40b0130..2a1ad10 100644
--- a/apps/website/pages/[slug].vue
+++ b/apps/website/pages/[slug].vue
@@ -17,8 +17,6 @@ const STUBS: Record<string, { legal: boolean }> = {
   status: { legal: false },
   docs: { legal: false },
   blog: { legal: false },
-  sla: { legal: true },
-  cookies: { legal: true },
 }
 
 const route = useRoute()
diff --git a/apps/website/pages/cookies.vue b/apps/website/pages/cookies.vue
new file mode 100644
index 0000000..11975f3
--- /dev/null
+++ b/apps/website/pages/cookies.vue
@@ -0,0 +1,73 @@
+<script setup lang="ts">
+import { useTheme, useCopy } from '~/composables/useLanding'
+
+definePageMeta({ layout: 'page' })
+
+const t = useTheme()
+const copy = useCopy()
+const c = computed(() => copy.value.pages.cookies)
+
+const headingStyle = computed(() => ({
+  fontFamily: '\'Inter Tight\', sans-serif', fontWeight: 600, fontSize: '22px',
+  letterSpacing: '-0.015em', color: t.value.fg, margin: '0 0 14px',
+}))
+</script>
+
+<template>
+  <LandingPageHeader :label="c.label" :title="c.title" :intro="c.intro" />
+
+  <LandingContainer pad="clamp(32px, 5vw, 48px) clamp(20px, 5vw, 64px) clamp(80px, 12vw, 160px)">
+    <div :style="{ maxWidth: '760px' }">
+      <div :style="{ fontFamily: '\'JetBrains Mono\', monospace', fontSize: '12px', color: t.fgDim, margin: '0 0 48px' }">{{ c.updated }}</div>
+
+      <!-- Clauses -->
+      <section v-for="(s, i) in c.sections" :key="i" :style="{ marginBottom: '36px' }">
+        <h2 :style="headingStyle">{{ s.h }}</h2>
+        <p
+          v-for="(para, j) in s.p" :key="j"
+          :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '15px', lineHeight: 1.65, color: t.fgMuted, margin: '0 0 12px', textWrap: 'pretty' }"
+        >{{ para }}</p>
+      </section>
+
+      <!-- Cookie table -->
+      <h2 :style="headingStyle">{{ c.tableHeading }}</h2>
+      <div :style="{ border: `1px solid ${t.border}`, borderRadius: '4px', overflow: 'hidden', margin: '0 0 40px' }">
+        <div class="cookie-row cookie-header" :style="{ padding: '13px 20px', background: t.surface, borderBottom: `1px solid ${t.border}`, fontFamily: '\'JetBrains Mono\', monospace', fontSize: '11px', letterSpacing: '0.06em', textTransform: 'uppercase', color: t.fgMuted }">
+          <span>{{ c.tableCols[0] }}</span>
+          <span>{{ c.tableCols[1] }}</span>
+          <span>{{ c.tableCols[2] }}</span>
+        </div>
+        <div
+          v-for="(row, i) in c.table" :key="i"
+          class="cookie-row"
+          :style="{ padding: '16px 20px', borderTop: i === 0 ? 'none' : `1px solid ${t.border}`, fontFamily: '\'Inter\', sans-serif', fontSize: '14px', alignItems: 'baseline' }"
+        >
+          <span :style="{ color: t.fg, fontWeight: 600, fontFamily: '\'JetBrains Mono\', monospace', fontSize: '13px' }">{{ row[0] }}</span>
+          <span :style="{ color: t.fgMuted }">{{ row[1] }}</span>
+          <span :style="{ color: t.fgMuted, fontFamily: '\'JetBrains Mono\', monospace', fontSize: '12px' }">{{ row[2] }}</span>
+        </div>
+      </div>
+
+      <!-- Contact -->
+      <h2 :style="headingStyle">{{ c.contactHeading }}</h2>
+      <p :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '15px', lineHeight: 1.6, color: t.fgMuted, margin: 0 }">{{ c.contactBody }}</p>
+    </div>
+  </LandingContainer>
+</template>
+
+<style scoped>
+.cookie-row {
+  display: grid;
+  grid-template-columns: 0.9fr 1.6fr 0.7fr;
+  gap: 16px;
+}
+@media (max-width: 768px) {
+  .cookie-row {
+    grid-template-columns: 1fr;
+    gap: 4px;
+  }
+  .cookie-header {
+    display: none;
+  }
+}
+</style>
diff --git a/apps/website/pages/sla.vue b/apps/website/pages/sla.vue
new file mode 100644
index 0000000..c2bcb33
--- /dev/null
+++ b/apps/website/pages/sla.vue
@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { useTheme, useCopy } from '~/composables/useLanding'
+import { C } from '~/utils/landingTokens'
+
+definePageMeta({ layout: 'page' })
+
+const t = useTheme()
+const copy = useCopy()
+const c = computed(() => copy.value.pages.sla)
+
+const headingStyle = computed(() => ({
+  fontFamily: '\'Inter Tight\', sans-serif', fontWeight: 600, fontSize: '22px',
+  letterSpacing: '-0.015em', color: t.value.fg, margin: '0 0 14px',
+}))
+</script>
+
+<template>
+  <LandingPageHeader :label="c.label" :title="c.title" :intro="c.intro" />
+
+  <LandingContainer pad="clamp(32px, 5vw, 48px) clamp(20px, 5vw, 64px) clamp(80px, 12vw, 160px)">
+    <div :style="{ maxWidth: '760px' }">
+      <!-- Draft / legal-review banner -->
+      <div :style="{ padding: '18px 22px', borderRadius: '4px', border: `1px solid ${C.warn}55`, background: `${C.warn}14`, fontFamily: '\'Inter\', sans-serif', fontSize: '14px', lineHeight: 1.55, color: t.fg }">
+        {{ c.draftNote }}
+      </div>
+      <div :style="{ fontFamily: '\'JetBrains Mono\', monospace', fontSize: '12px', color: t.fgDim, margin: '14px 0 40px' }">{{ c.updated }}</div>
+
+      <!-- Uptime headline -->
+      <div :style="{ display: 'flex', alignItems: 'baseline', gap: '16px', flexWrap: 'wrap', paddingBottom: '8px', marginBottom: '40px', borderBottom: `1px solid ${t.border}` }">
+        <span :style="{ fontFamily: '\'Inter Tight\', sans-serif', fontWeight: 600, fontSize: 'clamp(48px, 9vw, 72px)', letterSpacing: '-0.03em', lineHeight: 1, color: t.fg }">{{ c.uptimeValue }}</span>
+        <span :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '16px', color: t.fgMuted }">{{ c.uptimeNote }}</span>
+      </div>
+
+      <!-- Clauses -->
+      <section v-for="(s, i) in c.sections" :key="i" :style="{ marginBottom: '36px' }">
+        <h2 :style="headingStyle">{{ s.h }}</h2>
+        <p
+          v-for="(para, j) in s.p" :key="j"
+          :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '15px', lineHeight: 1.65, color: t.fgMuted, margin: '0 0 12px', textWrap: 'pretty' }"
+        >{{ para }}</p>
+      </section>
+
+      <!-- Support response-time table -->
+      <h2 :style="headingStyle">{{ c.supportHeading }}</h2>
+      <div :style="{ border: `1px solid ${t.border}`, borderRadius: '4px', overflow: 'hidden', margin: '0 0 40px' }">
+        <div :style="{ display: 'grid', gridTemplateColumns: '1fr auto', gap: '16px', padding: '13px 20px', background: t.surface, borderBottom: `1px solid ${t.border}`, fontFamily: '\'JetBrains Mono\', monospace', fontSize: '11px', letterSpacing: '0.06em', textTransform: 'uppercase', color: t.fgMuted }">
+          <span>{{ c.supportCols[0] }}</span>
+          <span :style="{ textAlign: 'right' }">{{ c.supportCols[1] }}</span>
+        </div>
+        <div
+          v-for="(row, i) in c.support" :key="i"
+          :style="{ display: 'grid', gridTemplateColumns: '1fr auto', gap: '16px', padding: '15px 20px', borderTop: i === 0 ? 'none' : `1px solid ${t.border}`, fontFamily: '\'Inter\', sans-serif', fontSize: '14px', alignItems: 'baseline' }"
+        >
+          <span :style="{ color: t.fg }">{{ row[0] }}</span>
+          <span :style="{ color: t.fg, fontWeight: 600, textAlign: 'right', whiteSpace: 'nowrap' }">{{ row[1] }}</span>
+        </div>
+      </div>
+
+      <!-- Contact -->
+      <h2 :style="headingStyle">{{ c.contactHeading }}</h2>
+      <p :style="{ fontFamily: '\'Inter\', sans-serif', fontSize: '15px', lineHeight: 1.6, color: t.fgMuted, margin: 0 }">{{ c.contactBody }}</p>
+    </div>
+  </LandingContainer>
+</template>
diff --git a/apps/website/utils/landingCopy.ts b/apps/website/utils/landingCopy.ts
index 51cefaf..4953a64 100644
--- a/apps/website/utils/landingCopy.ts
+++ b/apps/website/utils/landingCopy.ts
@@ -341,6 +341,57 @@ export const COPY = {
         contactHeading: 'Kontakt',
         contactBody: 'Spørgsmål til disse vilkår: legal@dezky.eu.',
       },
+      sla: {
+        label: 'sla',
+        title: 'Serviceniveauaftale',
+        intro: 'Denne serviceniveauaftale (SLA) beskriver vores driftsmål for oppetid og support på Dezky-platformen og vores gennemsigtighed om driften. Den er et bilag til servicevilkårene. Kontraktuelt bindende serviceniveauer med servicekreditter indgår i Enterprise-aftaler.',
+        updated: 'Senest opdateret: 6. juni 2026 · version 0.1 (udkast)',
+        draftNote: 'Udkast under juridisk gennemgang — kontakt legal@dezky.eu for den gældende version.',
+        uptimeValue: '99 %',
+        uptimeNote: 'driftsmål for oppetid pr. kalendermåned',
+        sections: [
+          { h: '1. Anvendelsesområde', p: ['Denne SLA gælder betalte produktionsabonnementer på Dezky. Gratis prøveperioder samt moduler markeret som "på vej" eller beta er ikke omfattet.'] },
+          { h: '2. Definitioner', p: ['"Oppetid" er den procentdel af en kalendermåned, hvor platformens kerneydelser (mail, drev, kalender, video, chat og login) er tilgængelige.', '"Nedetid" er sammenhængende perioder, hvor kerneydelserne er utilgængelige som følge af forhold, vi er ansvarlige for. Månedlig oppetid beregnes som (samlede minutter − nedetid) / samlede minutter.'] },
+          { h: '3. Oppetidsmål', p: ['Vi driver Dezky mod et mål om 99 % månedlig oppetid — svarende til højst ca. 7 timers nedetid om måneden. Vi måler oppetid via vores overvågning og er åbne om den på statussiden.'] },
+          { h: '4. Undtagelser', p: ['Følgende tæller ikke som nedetid: planlagt vedligehold varslet i forvejen; akut sikkerhedsvedligehold; force majeure og forhold uden for vores rimelige kontrol; problemer i kundens eget udstyr, netværk eller konfiguration; tredjepartstjenester uden for vores drift; samt suspension som følge af kundens overtrædelse af vilkårene.'] },
+          { h: '5. Planlagt vedligehold', p: ['Planlagt vedligehold varsles mindst 48 timer i forvejen og lægges så vidt muligt uden for normal dansk arbejdstid. Vi tilstræber at holde det under to timer pr. måned.'] },
+          { h: '6. Support', p: ['Support ydes på dansk og engelsk via e-mail på alle hverdage. Højere abonnementer får prioriterede kanaler og hurtigere svar. Svartiderne nedenfor er mål for vores første reaktion — ikke for endelig løsning.'] },
+          { h: '7. Enterprise-SLA', p: ['Har du brug for kontraktuelt bindende serviceniveauer — med garanteret oppetid, servicekreditter og forpligtende svartider — tilbyder vi en formel SLA som en del af en Enterprise-aftale. Kontakt os, så skræddersyr vi den til jeres behov.'] },
+          { h: '8. Statusside', p: ['Aktuel driftsstatus og historik findes på statussiden, hvor vi også varsler planlagt vedligehold og igangværende hændelser.'] },
+          { h: '9. Ændringer', p: ['Vi kan opdatere denne SLA. Væsentlige ændringer varsles med rimeligt varsel på denne side eller pr. e-mail.'] },
+        ],
+        supportHeading: 'Svartider for support',
+        supportCols: ['Alvorlighed', 'Mål for første svar'],
+        support: [
+          ['Kritisk · nedbrud', 'under 1 time'],
+          ['Høj · alvorligt forringet drift', 'under 4 timer'],
+          ['Normal · spørgsmål eller mindre fejl', 'næste arbejdsdag'],
+        ] as [string, string][],
+        contactHeading: 'Kontakt',
+        contactBody: 'Spørgsmål til denne SLA eller en Enterprise-aftale med kontraktuel SLA: legal@dezky.eu.',
+      },
+      cookies: {
+        label: 'cookiepolitik',
+        title: 'Cookiepolitik',
+        intro: 'Denne cookiepolitik forklarer, hvordan dezky.eu bruger cookies og lignende teknologier. Kort fortalt: vi bruger så få som muligt — kun det, der er nødvendigt for, at sitet og tjenesten virker — og vores analyse er helt cookiefri.',
+        updated: 'Senest opdateret: 6. juni 2026 · version 1.0',
+        sections: [
+          { h: '1. Hvad er cookies?', p: ['Cookies er små tekstfiler, som et website gemmer i din browser. De bruges typisk til at få sitet til at fungere, huske dine valg eller måle brug. Lignende teknologier omfatter fx local storage.'] },
+          { h: '2. Sådan bruger vi cookies', p: ['Vi bruger kun strengt nødvendige cookies samt en enkelt præference-cookie til at huske dit sprogvalg. Vi sætter ingen markedsførings- eller profileringscookies.', 'Fordi vi kun bruger nødvendige cookies, viser vi ikke et cookiebanner — der er ikke noget at give samtykke til.'] },
+          { h: '3. Analyse uden cookies', p: ['Vi måler brugen af sitet med Umami, et privatlivsvenligt analyseværktøj, der er cookiefrit og kun indsamler aggregeret, anonym statistik. Vi sporer dig ikke på tværs af websites.'] },
+          { h: '4. Ingen tredjepartssporing', p: ['Vi indlejrer ikke reklamenetværk, sociale plugins eller andre tredjeparter, der sætter sporingscookies. De cookies, der er nævnt nedenfor, sættes af os selv (førstepart).'] },
+          { h: '5. Sådan styrer du cookies', p: ['Du kan altid slette eller blokere cookies i din browsers indstillinger. Bemærk, at hvis du blokerer strengt nødvendige cookies, kan dele af tjenesten — fx at forblive logget ind — holde op med at virke.'] },
+          { h: '6. Ændringer', p: ['Vi kan opdatere denne politik, hvis vi ændrer vores brug af cookies. Væsentlige ændringer varsles på denne side med ny dato.'] },
+        ],
+        tableHeading: 'Cookies vi bruger',
+        tableCols: ['Cookie', 'Formål', 'Varighed'],
+        table: [
+          ['dezky-lang', 'Husker dit valgte sprog (dansk/engelsk)', '12 måneder'],
+          ['Loginsession', 'Holder dig logget ind på app.dezky.eu', 'Session'],
+        ] as [string, string, string][],
+        contactHeading: 'Kontakt',
+        contactBody: 'Spørgsmål om cookies eller databeskyttelse: privacy@dezky.eu.',
+      },
       stubs: {
         customers: 'Kunder',
         careers: 'Karriere',
@@ -702,6 +753,57 @@ export const COPY = {
         contactHeading: 'Contact',
         contactBody: 'Questions about these terms: legal@dezky.eu.',
       },
+      sla: {
+        label: 'sla',
+        title: 'Service level agreement',
+        intro: 'This service level agreement (SLA) describes our operational targets for uptime and support on the Dezky platform and how we stay transparent about operations. It forms an annex to the terms of service. Contractually binding service levels with service credits are part of Enterprise agreements.',
+        updated: 'Last updated: 6 June 2026 · version 0.1 (draft)',
+        draftNote: 'Draft under legal review — contact legal@dezky.eu for the current version.',
+        uptimeValue: '99%',
+        uptimeNote: 'uptime target per calendar month',
+        sections: [
+          { h: '1. Scope', p: ['This SLA applies to paid production subscriptions to Dezky. Free trials and modules marked "coming soon" or beta are not covered.'] },
+          { h: '2. Definitions', p: ['"Uptime" is the percentage of a calendar month during which the platform\'s core services (mail, drive, calendar, video, chat and sign-in) are available.', '"Downtime" is continuous periods during which the core services are unavailable due to factors we are responsible for. Monthly uptime is calculated as (total minutes − downtime) / total minutes.'] },
+          { h: '3. Uptime target', p: ['We operate Dezky toward a target of 99% monthly uptime — equivalent to at most roughly 7 hours of downtime per month. We measure uptime via our monitoring and are open about it on the status page.'] },
+          { h: '4. Exclusions', p: ['The following does not count as downtime: planned maintenance announced in advance; emergency security maintenance; force majeure and events outside our reasonable control; issues in the customer\'s own equipment, network or configuration; third-party services outside our operation; and suspension resulting from the customer\'s breach of the terms.'] },
+          { h: '5. Planned maintenance', p: ['Planned maintenance is announced at least 48 hours in advance and scheduled outside normal Danish business hours where possible. We aim to keep it under two hours per month.'] },
+          { h: '6. Support', p: ['Support is provided in Danish and English by email on all business days. Higher subscriptions get prioritised channels and faster responses. The response times below are targets for our first reply — not for final resolution.'] },
+          { h: '7. Enterprise SLA', p: ['If you need contractually binding service levels — with guaranteed uptime, service credits and committed response times — we offer a formal SLA as part of an Enterprise agreement. Contact us and we\'ll tailor it to your needs.'] },
+          { h: '8. Status page', p: ['Current operational status and history are available on the status page, where we also announce planned maintenance and ongoing incidents.'] },
+          { h: '9. Changes', p: ['We may update this SLA. Material changes are announced with reasonable notice on this page or by email.'] },
+        ],
+        supportHeading: 'Support response times',
+        supportCols: ['Severity', 'First-response target'],
+        support: [
+          ['Critical · outage', 'under 1 hour'],
+          ['High · seriously degraded', 'under 4 hours'],
+          ['Normal · question or minor issue', 'next business day'],
+        ] as [string, string][],
+        contactHeading: 'Contact',
+        contactBody: 'Questions about this SLA or an Enterprise agreement with a contractual SLA: legal@dezky.eu.',
+      },
+      cookies: {
+        label: 'cookie policy',
+        title: 'Cookie policy',
+        intro: 'This cookie policy explains how dezky.eu uses cookies and similar technologies. In short: we use as few as possible — only what\'s needed for the site and service to work — and our analytics are entirely cookie-free.',
+        updated: 'Last updated: 6 June 2026 · version 1.0',
+        sections: [
+          { h: '1. What are cookies?', p: ['Cookies are small text files a website stores in your browser. They are typically used to make the site work, remember your choices or measure usage. Similar technologies include local storage.'] },
+          { h: '2. How we use cookies', p: ['We use only strictly necessary cookies plus a single preference cookie to remember your language choice. We set no marketing or profiling cookies.', 'Because we only use necessary cookies, we don\'t show a cookie banner — there is nothing to consent to.'] },
+          { h: '3. Cookie-free analytics', p: ['We measure site usage with Umami, a privacy-friendly analytics tool that is cookie-free and only collects aggregated, anonymous statistics. We do not track you across websites.'] },
+          { h: '4. No third-party tracking', p: ['We don\'t embed ad networks, social plugins or other third parties that set tracking cookies. The cookies listed below are set by us (first-party).'] },
+          { h: '5. How to control cookies', p: ['You can delete or block cookies at any time in your browser settings. Note that if you block strictly necessary cookies, parts of the service — such as staying signed in — may stop working.'] },
+          { h: '6. Changes', p: ['We may update this policy if we change how we use cookies. Material changes are announced on this page with a new date.'] },
+        ],
+        tableHeading: 'Cookies we use',
+        tableCols: ['Cookie', 'Purpose', 'Duration'],
+        table: [
+          ['dezky-lang', 'Remembers your chosen language (Danish/English)', '12 months'],
+          ['Login session', 'Keeps you signed in to app.dezky.eu', 'Session'],
+        ] as [string, string, string][],
+        contactHeading: 'Contact',
+        contactBody: 'Questions about cookies or data protection: privacy@dezky.eu.',
+      },
       stubs: {
         customers: 'Customers',
         careers: 'Careers',