diff --git a/app/globals.css b/app/globals.css
index 61dd1d7..016707d 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -19,9 +19,9 @@
--radius-sm: 6px;
--shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
- --font-display: "Archivo Expanded", "Archivo", system-ui, sans-serif;
- --font-body: "Inter", system-ui, -apple-system, sans-serif;
- --font-mono: "Geist Mono", "SFMono-Regular", ui-monospace, monospace;
+ --font-display: var(--font-archivo, "Archivo Expanded"), "Archivo", system-ui, sans-serif;
+ --font-body: var(--font-body, "Inter"), system-ui, -apple-system, sans-serif;
+ --font-mono: var(--font-mono, "Geist Mono"), "SFMono-Regular", ui-monospace, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
@@ -63,6 +63,7 @@ a { color: inherit; text-decoration: none; }
.brand { display: flex; align-items: baseline; gap: 12px; }
.brand-mark {
font-family: var(--font-display);
+ font-stretch: expanded;
font-weight: 800; letter-spacing: -0.02em;
font-size: clamp(20px, 3vw, 28px);
text-transform: uppercase;
@@ -115,7 +116,8 @@ a { color: inherit; text-decoration: none; }
background: var(--bg-raised);
}
.group-name {
- font-family: var(--font-display); font-weight: 800; font-size: 16px;
+ font-family: var(--font-display); font-stretch: expanded;
+ font-weight: 800; font-size: 16px;
text-transform: uppercase; letter-spacing: 0.02em;
}
.group-name.group-complete { color: var(--turf); }
diff --git a/app/layout.tsx b/app/layout.tsx
index aef8020..6e94050 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,7 +1,30 @@
import type { Metadata } from "next";
import Script from "next/script";
+import { Archivo, Inter, Geist_Mono } from "next/font/google";
import "./globals.css";
+const archivo = Archivo({
+ subsets: ["latin"],
+ weight: ["500", "700", "800"],
+ style: ["normal", "italic"],
+ variable: "--font-archivo",
+ display: "swap",
+});
+
+const inter = Inter({
+ subsets: ["latin"],
+ weight: ["400", "500", "600", "700"],
+ variable: "--font-body",
+ display: "swap",
+});
+
+const geistMono = Geist_Mono({
+ subsets: ["latin"],
+ weight: ["400", "500", "600"],
+ variable: "--font-mono",
+ display: "swap",
+});
+
export const metadata: Metadata = {
title: "WM 26 — Gruppen & K.o.-Baum",
description:
@@ -15,15 +38,8 @@ export const viewport = {
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
-
-
-
-
-
-
+
+