/* Takvel – Design-Tokens und Grundstile. Erzeugt aus ci/src/build_tokens.py. */
/* Kopie aus Logo/takvel/ci/tokens/takvel.css; Schriftpfad auf ../fonts/ angepasst (SIL Open Font License). */
@font-face{font-family:'Inter';font-weight:400;font-style:normal;font-display:swap;src:url('../fonts/Inter-Regular.woff2') format('woff2')}
@font-face{font-family:'Inter';font-weight:400;font-style:italic;font-display:swap;src:url('../fonts/Inter-Italic.woff2') format('woff2')}
@font-face{font-family:'Inter';font-weight:500;font-style:normal;font-display:swap;src:url('../fonts/Inter-Medium.woff2') format('woff2')}
@font-face{font-family:'Inter';font-weight:600;font-style:normal;font-display:swap;src:url('../fonts/Inter-SemiBold.woff2') format('woff2')}
@font-face{font-family:'Inter';font-weight:700;font-style:normal;font-display:swap;src:url('../fonts/Inter-Bold.woff2') format('woff2')}
@font-face{font-family:'Inter Display';font-weight:600;font-style:normal;font-display:swap;src:url('../fonts/InterDisplay-SemiBold.woff2') format('woff2')}
@font-face{font-family:'Inter Display';font-weight:700;font-style:normal;font-display:swap;src:url('../fonts/InterDisplay-Bold.woff2') format('woff2')}

:root {
  --takvel-graphit: #17181D;
  --takvel-kobalt: #2D4BFF;
  --takvel-kobalt-hell: #6E84FF;
  --takvel-weiss: #FFFFFF;
  --takvel-kobalt-50: #F2F6FF;
  --takvel-kobalt-100: #E4EBFF;
  --takvel-kobalt-200: #C7D4FF;
  --takvel-kobalt-300: #9EB2FF;
  --takvel-kobalt-400: #6E84FF;
  --takvel-kobalt-500: #2D4BFF;
  --takvel-kobalt-600: #263FD7;
  --takvel-kobalt-700: #1F32AB;
  --takvel-kobalt-800: #17247E;
  --takvel-kobalt-900: #101857;
  --takvel-grau-50: #F6F6F6;
  --takvel-grau-100: #ECEDED;
  --takvel-grau-200: #DADADB;
  --takvel-grau-300: #BEBEC0;
  --takvel-grau-400: #949497;
  --takvel-grau-500: #737377;
  --takvel-grau-600: #58595D;
  --takvel-grau-700: #404146;
  --takvel-grau-800: #2C2D32;
  --takvel-grau-900: #17181D;
  --takvel-erfolg: #17804F;
  --takvel-warnung: #A35C00;
  --takvel-fehler: #D02A3C;
  --takvel-info: #2D4BFF;
  --takvel-app-kobalt: #2D4BFF;
  --takvel-app-petrol: #0B6F7A;
  --takvel-app-koralle: #D2432F;
  --takvel-app-pflaume: #8A2F7E;
  --takvel-app-ocker: #9A6200;
  --takvel-app-graphit: #17181D;
  --takvel-font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --takvel-font-display: 'Inter Display', 'Inter', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --takvel-space-1: 4px;
  --takvel-space-2: 8px;
  --takvel-space-3: 12px;
  --takvel-space-4: 16px;
  --takvel-space-5: 24px;
  --takvel-space-6: 32px;
  --takvel-space-7: 48px;
  --takvel-space-8: 64px;
  --takvel-space-9: 96px;
  --takvel-space-10: 128px;
  --takvel-radius-s: 4px;
  --takvel-radius-m: 8px;
  --takvel-radius-l: 14px;
  --takvel-radius-pill: 999px;
  --takvel-shadow-karte: 0 1px 2px rgba(23,24,29,.06), 0 4px 16px rgba(23,24,29,.06);
  --takvel-shadow-fokus: 0 0 0 3px rgba(45,75,255,.35);
}

body { font-family: var(--takvel-font-sans); color: var(--takvel-graphit); background: #fff;
       font-size: 16px; line-height: 24px; -webkit-font-smoothing: antialiased; }
.t-display { font-family: var(--takvel-font-display); font-weight: 700; font-size: 64px; line-height: 68px; letter-spacing: -0.025em; font-feature-settings: 'cv11'; }  /* Startseiten-Titel, Kampagnen */
.t-h1 { font-family: var(--takvel-font-display); font-weight: 700; font-size: 44px; line-height: 50px; letter-spacing: -0.02em; font-feature-settings: 'cv11'; }  /* Seitentitel */
.t-h2 { font-family: var(--takvel-font-display); font-weight: 600; font-size: 32px; line-height: 38px; letter-spacing: -0.015em; font-feature-settings: 'cv11'; }  /* Abschnitte */
.t-h3 { font-family: var(--takvel-font-sans); font-weight: 600; font-size: 22px; line-height: 28px; letter-spacing: -0.01em; }  /* Zwischentitel, Karten */
.t-lead { font-family: var(--takvel-font-sans); font-weight: 400; font-size: 20px; line-height: 30px; letter-spacing: -0.005em; }  /* Einleitung */
.t-body { font-family: var(--takvel-font-sans); font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: 0em; }  /* Fließtext */
.t-small { font-family: var(--takvel-font-sans); font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: 0em; }  /* Hinweise, Tabellen */
.t-label { font-family: var(--takvel-font-sans); font-weight: 600; font-size: 12px; line-height: 16px; letter-spacing: 0.06em; text-transform: uppercase; }  /* Kategorien, Überzeilen (VERSALIEN) */

a { color: var(--takvel-kobalt); text-underline-offset: 3px; }
.takvel-dark a { color: var(--takvel-kobalt-hell); }
.btn { display:inline-flex; align-items:center; gap:8px; font: 600 16px/24px var(--takvel-font-sans);
       padding: 12px 20px; border-radius: var(--takvel-radius-m); border: 0; cursor: pointer; text-decoration: none; }
.btn-primaer { background: var(--takvel-kobalt); color: #fff; }
.btn-primaer:hover { background: var(--takvel-kobalt-600); }
.btn-sekundaer { background: #fff; color: var(--takvel-graphit); box-shadow: inset 0 0 0 1.5px var(--takvel-grau-300); }
:focus-visible { outline: none; box-shadow: var(--takvel-shadow-fokus); }