From c775e02d3d5fce0c4ceac224222164fcd9b675fa Mon Sep 17 00:00:00 2001 From: Jonathan Hvid Date: Thu, 18 Jun 2026 15:10:24 +0200 Subject: [PATCH] =?UTF-8?q?deck:=20third=20round=20=E2=80=94=20content=20b?= =?UTF-8?q?oxes,=20hero/logo=20polish?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Slides 13 & 16: redesign the boxes as text-forward cards (number + title, bold lead, three bullets) with full new Danish copy; slide 16 becomes the green 'solutions' answer to slide 13's concerns. - Slide 1: 'Bifrost Advisory Meeting - 001' now matches 'Velkommen til' (uppercase sans, ink-dim); both +50%; eyebrow lifted, wordmark lowered. - Slide 3: title lifted, titles/companies +10%, portraits +10% spread wider (same air between people). - Slide 4: 'Sovereign. Trusted. Innovative.' +40%; logos spread edge to edge; DCAI + Digitaliseringsstyrelsen +10%, Datatilsynet +5%. - Slide 12: title above the logo, +25%. - Slide 17: title 'Den Regulatoriske AI-sandkasse' on two lines; Digitaliseringsstyrelsen +50%, Datatilsynet +30%. - Slide 19: full-size Project Bifrost wordmark below the arc. - Remove the dead reserved-points layout. Co-Authored-By: Claude Opus 4.8 (1M context) --- assets/css/deck.css | 208 ++++++++++++++++++++++---------------------- index.html | 131 +++++++++++++++++----------- 2 files changed, 184 insertions(+), 155 deletions(-) diff --git a/assets/css/deck.css b/assets/css/deck.css index 0b3e934..2dad36f 100644 --- a/assets/css/deck.css +++ b/assets/css/deck.css @@ -377,13 +377,13 @@ img { display: block; max-width: 100%; } } .hero-eyebrow { font-family: var(--font-sans); - font-size: clamp(1rem, 1.5vw, 1.35rem); /* larger */ - letter-spacing: 0.32em; + font-size: clamp(1.5rem, 2.25vw, 2rem); /* +50% */ + letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink-dim); font-weight: 600; /* Lifted higher above the wordmark. */ - margin: 0 0 clamp(1rem, 4vh, 2.6rem); + margin: 0 0 clamp(1.8rem, 5.5vh, 3.6rem); } /* "Project Bifrost" wordmark — the old reveal's typography. */ .bifrost-name { @@ -393,7 +393,7 @@ img { display: block; max-width: 100%; } line-height: 1.02; letter-spacing: -0.03em; color: var(--ink); - margin: clamp(0.4rem, 1.8vh, 1.4rem) 0 0; /* nudged slightly lower */ + margin: clamp(1.3rem, 4vh, 2.8rem) 0 0; /* nudged lower */ } .bifrost-name .accent { font-style: italic; @@ -403,12 +403,15 @@ img { display: block; max-width: 100%; } background-clip: text; -webkit-text-fill-color: transparent; } +/* Lower line — same uppercase sans + ink-dim colour as the eyebrow. */ .hero-sub { - font-family: var(--font-serif); - font-style: normal; /* italic removed */ - font-size: clamp(2.4rem, 4.2vw, 3.5rem); /* ~double */ - letter-spacing: -0.02em; - color: var(--ink-soft); + font-family: var(--font-sans); + font-style: normal; + font-size: clamp(1.5rem, 2.25vw, 2rem); /* matches the eyebrow, +50% */ + letter-spacing: 0.3em; + text-transform: uppercase; + font-weight: 600; + color: var(--ink-dim); margin: 0; } @media (prefers-reduced-motion: reduce) { @@ -446,7 +449,9 @@ img { display: block; max-width: 100%; } .agenda-row.is-break .agenda-label { color: var(--ink-dim); font-weight: 400; font-style: normal; } /* ════════════════════ Slide 3 — Board / introductions ════════════════════ */ -#slide-board .slide-inner { max-width: 1240px; } +/* Wider container + slightly larger portraits keep the same air between + people (they just spread further out). Whole block lifted a touch. */ +#slide-board .slide-inner { max-width: 1320px; transform: translateY(-4vh); } .board-head { text-align: center; margin-bottom: clamp(1.8rem, 4vh, 3rem); } .board-head .slide-title { margin-inline: auto; max-width: 20ch; } .board-grid { @@ -455,9 +460,9 @@ img { display: block; max-width: 100%; } gap: clamp(1rem, 2vw, 2rem) clamp(1rem, 2.2vw, 2.4rem); } .board-member { margin: 0; text-align: center; } -/* Portraits at half size — sit centred in their cell, names lead. */ +/* Portraits ~10% larger, centred in their (now wider) cell. */ .board-portrait { - width: 50%; + width: 52%; aspect-ratio: 1 / 1; margin: 0 auto 0.9rem; border-radius: var(--radius-lg); @@ -480,14 +485,14 @@ img { display: block; max-width: 100%; } } .bm-title { font-family: var(--font-sans); - font-size: clamp(0.89rem, 1.1vw, 1.01rem); /* +20% */ + font-size: clamp(0.98rem, 1.21vw, 1.11rem); /* +20%, then +10% */ color: var(--ink-soft); margin: 0 0 0.15rem; line-height: 1.35; } .bm-company { font-family: var(--font-sans); - font-size: clamp(0.79rem, 0.98vw, 0.91rem); /* +20% */ + font-size: clamp(0.87rem, 1.08vw, 1rem); /* +20%, then +10% */ letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-dim); @@ -519,7 +524,7 @@ img { display: block; max-width: 100%; } .mission-values { font-family: var(--font-sans); font-weight: 600; - font-size: clamp(1rem, 1.8vw, 1.5rem); + font-size: clamp(1.4rem, 2.5vw, 2.1rem); /* +40% */ letter-spacing: 0.01em; color: var(--ink); margin: 0; @@ -544,15 +549,24 @@ img { display: block; max-width: 100%; } size adjustments. Innovationsfonden is the largest footprint, BII and Datatilsynet held back. (Innovationsfonden's PNG is cropped tight so its height reads true.) */ -.mission-logos { gap: clamp(2.75rem, 5.8vw, 5.8rem); } +/* Spread the logos across the full width — they push out to the sides + with maximum air between them. */ +.mission-logos { + width: 100%; + flex-wrap: nowrap; + justify-content: space-between; + gap: clamp(1rem, 2.5vw, 2.5rem); +} .mission-logos .partner-logo img { height: clamp(34px, 4vw, 48px); - max-width: clamp(140px, 20vw, 250px); + max-width: clamp(140px, 18vw, 230px); opacity: 0.82; } -.mission-logos .partner-logo img.logo-inf { height: clamp(40px, 4.8vw, 58px); max-width: clamp(200px, 28vw, 320px); } /* +50% footprint */ -.mission-logos .partner-logo img.logo-bii { height: clamp(27px, 3.2vw, 40px); } /* -20% */ -.mission-logos .partner-logo img.logo-dt { height: clamp(30px, 3.6vw, 45px); } /* -10% */ +.mission-logos .partner-logo img.logo-inf { height: clamp(40px, 4.8vw, 58px); max-width: clamp(200px, 26vw, 300px); } /* +50% footprint */ +.mission-logos .partner-logo img.logo-bii { height: clamp(27px, 3.2vw, 40px); } /* -20% */ +.mission-logos .partner-logo img.logo-dt { height: clamp(32px, 3.8vw, 47px); } /* -10%, then +5% */ +.mission-logos .partner-logo img.logo-ds { height: clamp(37px, 4.4vw, 53px); } /* +10% */ +.mission-logos .partner-logo img.logo-dcai { height: clamp(37px, 4.4vw, 53px); } /* +10% */ /* Quiet partner-logo row (sandbox) */ .partner-row { @@ -586,7 +600,8 @@ img { display: block; max-width: 100%; } mission row, digitaliseringsstyrelsen a further 10% on top. */ .partner-row.lg { gap: clamp(2.4rem, 6vw, 5rem); } .partner-row.lg .partner-logo img { height: clamp(39px, 4.7vw, 60px); opacity: 0.85; } -.partner-row.lg .partner-logo img.ds-logo { height: clamp(47px, 5.7vw, 73px); } +.partner-row.lg .partner-logo img.ds-logo { height: clamp(70px, 8.5vw, 110px); } /* +50% */ +.partner-row.lg .partner-logo img.dt-logo { height: clamp(51px, 6.1vw, 78px); } /* +30% */ /* ════════════════════ Slide 6 — Pause ════════════════════ */ #slide-pause { } @@ -739,107 +754,88 @@ img { display: block; max-width: 100%; } text-wrap: balance; } .section-title em { font-style: italic; font-weight: 460; color: var(--terracotta); } -/* One-line variant (Suverænitet divider) — fits on a single line. */ +/* One-line variant (Suverænitet divider) — fits on a single line, +25%. */ .section-title.one-line { max-width: none; white-space: nowrap; - font-size: clamp(1.3rem, 3.1vw, 2.9rem); + font-size: clamp(1.55rem, 3.85vw, 3.6rem); } -/* Reserved-points layout (slide 14) */ -.approach-points { - list-style: none; - margin: clamp(1.5rem, 4vh, 2.5rem) 0 0; - padding: 0; - display: grid; - gap: clamp(0.7rem, 1.6vh, 1.1rem); - width: min(640px, 100%); - text-align: left; -} -.approach-points li { - display: flex; - align-items: center; - gap: 1rem; - padding: clamp(0.85rem, 1.8vh, 1.15rem) clamp(1.1rem, 2vw, 1.5rem); - border: 1px dashed rgba(56,56,49,0.2); - border-radius: var(--radius-md); - color: var(--ink-dim); - background: rgba(255,252,247,0.35); -} -.approach-points li::before { - content: ""; - width: 8px; height: 8px; - border-radius: 50%; - background: linear-gradient(120deg, var(--aurora-2), var(--aurora-4)); - flex: 0 0 auto; -} -.approach-points .ph-text { - font-family: var(--font-serif); - font-style: italic; - font-size: clamp(0.95rem, 1.3vw, 1.1rem); -} - -/* ════════════════════ Slide 11 — Highlight boxes ════════════════════ */ -#slide-highlights .slide-inner { max-width: 1140px; } -.highlights-head { text-align: center; margin-bottom: clamp(1.6rem, 4vh, 2.6rem); } +/* ════════════════════ Highlight / solution boxes (slides 13 & 16) ════════════════════ + Text-forward cards: number + title, a bold lead, three supporting + bullets. A coloured top rule carries the category; the green-washed + `.solutions` variant signals "these are the answers". */ +.hl-inner { max-width: 1460px; } +.highlights-head { text-align: center; margin-bottom: clamp(0.8rem, 2.2vh, 1.6rem); } +.highlights-head .slide-title { font-size: clamp(1.5rem, 2.8vw, 2.3rem); } .highlight-grid { display: grid; grid-template-columns: repeat(4, 1fr); - gap: clamp(0.9rem, 1.8vw, 1.5rem); + gap: clamp(0.8rem, 1.5vw, 1.4rem); + align-items: stretch; } .highlight-box { - position: relative; - border-radius: var(--radius-lg); - overflow: hidden; + --tone: var(--ink-dim); background: var(--paper-high); + border-radius: var(--radius-md); + border-top: 3px solid var(--tone); box-shadow: 0 0 0 0.5px rgba(56,56,49,0.06), - 0 18px 36px -22px rgba(56,56,49,0.28); - display: flex; - flex-direction: column; - min-height: clamp(300px, 44vh, 420px); -} -.highlight-art { - height: 42%; + 0 16px 32px -22px rgba(56,56,49,0.26); + padding: clamp(1rem, 1.6vw, 1.45rem) clamp(1rem, 1.5vw, 1.3rem) clamp(1.1rem, 1.8vw, 1.5rem); display: grid; - place-items: center; - position: relative; - overflow: hidden; -} -.highlight-art svg { width: 56%; height: 56%; } -.highlight-box[data-tone="terracotta"] .highlight-art { background: linear-gradient(150deg, #c98a78, #a4553b); } -.highlight-box[data-tone="indigo"] .highlight-art { background: linear-gradient(150deg, #7b91a6, #5a6d83); } -.highlight-box[data-tone="heather"] .highlight-art { background: linear-gradient(150deg, #a594a0, #6e5a86); } -.highlight-box[data-tone="ochre"] .highlight-art { background: linear-gradient(150deg, #d4b478, #b08a3e); } -.highlight-art svg { stroke: rgba(255,252,247,0.92); } -.highlight-body { - padding: clamp(1rem, 1.8vw, 1.4rem); - display: grid; - gap: 0.5rem; + gap: clamp(0.5rem, 1vh, 0.85rem); align-content: start; - flex: 1; + text-align: left; } -.highlight-num { - font-family: var(--font-serif); - font-style: italic; - font-size: 0.85rem; - color: var(--ink-dim); +.highlight-box[data-tone="indigo"] { --tone: var(--indigo); } +.highlight-box[data-tone="terracotta"] { --tone: var(--terracotta); } +.highlight-box[data-tone="heather"] { --tone: var(--heather); } +.highlight-box[data-tone="ochre"] { --tone: var(--ochre); } +.highlight-box[data-tone="copper"] { --tone: var(--copper); } +/* Solutions — quiet green wash so the slide reads as the answers. */ +.highlight-grid.solutions .highlight-box { + --tone: var(--copper); + background: linear-gradient(180deg, rgba(109,140,124,0.12), rgba(255,252,247,0.65)); } -.highlight-name { - font-family: var(--font-serif); - font-weight: 400; - font-size: clamp(1.15rem, 1.7vw, 1.45rem); - line-height: 1.12; - letter-spacing: -0.015em; +.hl-head { + font-family: var(--font-sans); + font-weight: 700; + font-size: clamp(0.92rem, 1.2vw, 1.12rem); + letter-spacing: -0.01em; color: var(--ink); margin: 0; } -.highlight-note { - font-family: var(--font-sans); - font-size: clamp(0.78rem, 0.98vw, 0.9rem); - color: var(--ink-soft); +.hl-head .hl-num { color: var(--tone); } +.hl-lead { + font-family: var(--font-serif); + font-size: clamp(0.9rem, 1.12vw, 1.06rem); + line-height: 1.32; + color: var(--ink); margin: 0; - line-height: 1.45; +} +.hl-list { + list-style: none; + margin: 0; + padding: 0; + display: grid; + gap: clamp(0.4rem, 0.9vh, 0.7rem); +} +.hl-list li { + position: relative; + padding-left: 0.95rem; + font-family: var(--font-sans); + font-size: clamp(0.72rem, 0.9vw, 0.84rem); + line-height: 1.4; + color: var(--ink-soft); +} +.hl-list li::before { + content: ""; + position: absolute; + left: 0; top: 0.5em; + width: 5px; height: 5px; + border-radius: 50%; + background: var(--tone); } @media (max-width: 980px) { .highlight-grid { grid-template-columns: repeat(2, 1fr); } @@ -895,9 +891,9 @@ img { display: block; max-width: 100%; } } /* ════════════════════ Slide 19 — Closing ════════════════════ */ -/* Closing text lifted ~20% so it sits clear above the aurora arc. */ -#slide-thanks .hero-text { gap: clamp(1.2rem, 3vh, 2rem); } -.thanks-text { transform: translateY(-19vh); } +/* "Tak for jeres rådgivning" sits above the arc; the full-size Project + Bifrost wordmark sits below it — a big gap splits them across the arc. */ +.thanks-text { gap: clamp(11rem, 28vh, 19rem); transform: translateY(-6vh); } .thanks-title { font-family: var(--font-serif); font-weight: 340; @@ -908,8 +904,8 @@ img { display: block; max-width: 100%; } line-height: 1; } .thanks-title em { font-style: italic; font-weight: 440; } -/* "Project Bifrost" wordmark on the closing slide — smaller than slide 1. */ -.thanks-bifrost { font-size: clamp(1.8rem, 4vw, 3.2rem); margin: 0; } +/* "Project Bifrost" wordmark — same size as slide 1, sitting below the arc. */ +.thanks-bifrost { font-size: clamp(3rem, 8vw, 6.5rem); margin: 0; } /* Small responsive guard for very short viewports */ @media (max-height: 640px) { diff --git a/index.html b/index.html index 6f930ea..b17a6a1 100644 --- a/index.html +++ b/index.html @@ -171,8 +171,8 @@ - - + + @@ -328,61 +328,57 @@
- Fenja AI

Suverænitet, Sikkerhed & Governance

+ Fenja AI
-
+

Hvorfor suverænitet betyder noget

Fire grunde til at tænke sig om

-
- -
-
- 01 -

US Cloud Act

-

Amerikansk lovgivning kan give myndigheder adgang til data hos amerikanske udbydere — uanset hvor data fysisk ligger.

-
+

01 — US Cloud Act

+

Amerikanske myndigheder kan få adgang til dine data. Også når de ligger i EU.

+
    +
  • Vælger du en amerikansk udbyder, gælder amerikansk lov. Også selvom dine data står i et datacenter i EU.
    • +
  • Microsoft har under ed i fransk ret indrømmet, at de ikke kan garantere suverænitet. Heller ikke i deres egen “sovereign cloud”.
    • +
  • Et datacenter i EU er bare en adresse. Det er ejeren, der afgør, hvilken lov der gælder, ikke hvor maskinen står.
    • +
-
- -
-
- 02 -

Geopolitisk uro

-

Skiftende alliancer og handelspolitik gør afhængighed af enkelte landes teknologi til en strategisk risiko.

-
+

02 — Geopolitisk uro

+

Alliancer skifter. Det gør ét lands teknologi til en risiko, du ikke selv styrer.

+
    +
  • Handelspolitik kan vende hurtigt. Det gælder også hos nære partnere som USA.
    • +
  • Told og eksportrestriktioner kan ramme uden varsel og sende prisen op.
    • +
  • Er du afhængig af ét lands teknologi, bliver din drift en brik i forhandlinger, du ikke selv sidder med i.
    • +
-
- -
-
- 03 -

Fable 5 — kun for amerikanske statsborgere

-

Når de mest avancerede modeller forbeholdes bestemte nationaliteter, står resten uden adgang til frontteknologien.

-
+

03 — Fable 5 / Mythos

+

En regering kan lukke din AI med ét brev.

+
    +
  • Den 1. juni 2026 lukkede den amerikanske regering adgangen til Anthropics bedste modeller, få dage efter de var udkommet.
    • +
  • Det ramte alle brugere uden for USA. Sad du i Europa, mistede du adgangen, uanset hvad din kontrakt sagde.
    • +
  • Der kom intet varsel og ingen overgangsperiode. På få timer holdt integrationer og produkter op med at virke.
    • +
-
- -
-
- 04 -

Vendor lock-in

-

Bindes I til én leverandørs lukkede økosystem, mister I forhandlingskraft, fleksibilitet og kontrol over fremtiden.

-
+

04 — Vendor lock-in

+

Lock-in på data var til at leve med. På intelligensen er det en anden sag.

+
    +
  • Lock-in på dataplatforme var slemt nok. Nu er det selve den intelligens, der driver forretningen, der bliver bundet.
    • +
  • Vi så det med dataplatforme. Så snart udbyderne havde markedet, steg priserne.
    • +
  • Er din kerneproces bundet til én udbyders model, er det dem, der sætter prisen. Og du betaler.
    • +
@@ -411,28 +407,65 @@ Fenja AI
- -
-
- Fenja AI -

Vores tilgang til Suverænitet, Sikkerhed & Governance

-
    -
  • Punkt tilføjes
    • -
  • Punkt tilføjes
    • -
  • Punkt tilføjes
    • -
  • Punkt tilføjes
    • -
+ +
+
+
+

Vores tilgang til suverænitet, sikkerhed & governance

+

Fire svar på de samme bekymringer

+
+
+
+

01 — Datasuverænitet by design

+

Svaret på Cloud Act, og på at et EU-datacenter ikke er nok.

+
    +
  • Kører i jeres eget miljø, on-prem eller i egen sky. Data forlader aldrig jeres perimeter.
    • +
  • Vi ser aldrig jeres prompts eller data. Der er ingen kæde at lække igennem.
    • +
  • Ingen Cloud Act-eksponering. Der står ingen amerikansk udbyder mellem dig og din intelligens. For den sags skyld ingen ekstern udbyder overhovedet.
    • +
+
+ +
+

02 — Driftssikkerhed & kontinuitet

+

Svaret på Fable 5-lukningen. Ingen kill-switch udefra.

+
    +
  • Modellen og vægtene ligger hos dig. Ingen kan slukke den udefra med et brev. Fable 5-scenariet kan ikke ske her.
    • +
  • Ingen ekstern API-afhængighed. Drift og failover ligger inden for jeres egen kontrol.
    • +
  • Du ejer livscyklussen. Ingen udefra kan tvinge dig til at opgradere eller lukke ned.
    • +
+
+ +
+

03 — Sikkerhed i flere lag

+

Her er sikkerhed en del af fundamentet. Ikke noget, der er sat ovenpå bagefter.

+
    +
  • Det hele kører bag jeres egne firewalls og adgangskontroller. Jeres eksisterende sikkerhedsstack gælder også for AI’en.
    • +
  • Fuldt auditspor lokalt. I kan se, hvem der spurgte om hvad, hvornår, og hvilken model der svarede. Loggene forlader aldrig huset.
    • +
  • Løbende red-teaming og hærdede modeller leveret til jer, så sårbarheder bliver fanget, før de bliver til hændelser.
    • +
+
+ +
+

04 — Governance & frihed fra lock-in

+

Svaret på vendor lock-in og geopolitisk afhængighed.

+
    +
  • Modelagnostisk, og det er dit at beholde. Skift eller kombinér modeller i dit eget miljø uden at bygge om.
    • +
  • Ingen forbrugsbaseret afhængighed. Prisen kan ikke skrues op, for driften ligger ikke i vores hænder.
    • +
  • Compliance, der kan revideres og ligger inden for jeres egen kontrol. Klar til EU AI Act og GDPR fra dag ét.
    • +
+
+
-

Regulatorisk AI-sandkasse

+

Den Regulatoriske
AI-sandkasse

Fenja AI er optaget i Den Regulatoriske AI-sandkasse — et forløb under Datatilsynet og Digitaliseringsstyrelsen, hvor udvalgte virksomheder udvikler og afprøver deres AI i tæt dialog med myndighederne og inden for de regulatoriske rammer. Vi er en ud af kun to virksomheder, som er blevet optaget i år.

- +