/* Schriften und Tokens: src/c2.css (erzeugt von scripts/angebote/bauen.mjs) */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/fonts/c2/plus-jakarta-sans-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/fonts/c2/plus-jakarta-sans-latin-wght-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  /* Marke */
  --c2-tief: #073D45;
  --c2-flaeche: #0A4A52;
  --c2-linie-d: #2F6670;
  --c2-marke: #0B4F4A;
  --c2-orange: #E8723A;
  --c2-orange-hover: #F08A55;
  --c2-toenung: #E3EEEF;
  /* Neutral */
  --c2-hell: #F6F2EA;
  --c2-grau-hell: #B9CFD2;
  --c2-tinte: #1A1A2E;
  --c2-grau: #4E5A5C;
  --c2-grund: #FFFFFF;
  --c2-papier: #F4F6F5;
  --c2-linie: #D3DEDF;
  /* Zustand */
  --c2-warn: #FBE3D3;

  /* Schriftfamilien: Namen nur hier (und in src/lib/themeC2.js). Wortmarke: Inter, unveraendert. */
  /* Vorschau v4: Kandidat C der Schriftprobe (vorher 'Zilla Slab' / 'Lato', Rueckweg: nur diese zwei Zeilen) */
  --c2-font-head: 'Plus Jakarta Sans', 'Segoe UI', Arial, sans-serif;
  --c2-font-text: 'Inter', 'Segoe UI', Arial, sans-serif;
  --c2-font-marke: 'Inter', 'DM Sans', sans-serif;

  /* Schriftleiter: nur ganze Pixel, Groesse / Zeilenhoehe */
  --c2-fs-56: 56px; --c2-lh-56: 60px;
  --c2-fs-40: 40px; --c2-lh-40: 48px;
  --c2-fs-32: 32px; --c2-lh-32: 40px;
  --c2-fs-24: 24px; --c2-lh-24: 32px;
  --c2-fs-20: 20px; --c2-lh-20: 28px;
  --c2-fs-18: 18px; --c2-lh-18: 28px;
  --c2-fs-16: 16px; --c2-lh-16: 24px;
  --c2-fs-14: 14px; --c2-lh-14: 20px;
  --c2-fs-13: 13px; --c2-lh-13: 20px;
  --c2-fs-12: 12px; --c2-lh-12: 16px;

  /* Radien: 4 Knoepfe, Felder, Plaketten, Reiter; 8 Karten, Fotos. Keine Pillenform. */
  --c2-r-4: 4px;
  --c2-r-8: 8px;

  /* Abstaende: 4er-Raster */
  --c2-s-4: 4px; --c2-s-8: 8px; --c2-s-12: 12px; --c2-s-16: 16px; --c2-s-20: 20px; --c2-s-24: 24px;
  --c2-s-32: 32px; --c2-s-40: 40px; --c2-s-48: 48px; --c2-s-56: 56px; --c2-s-72: 72px; --c2-s-88: 88px;
}
/* Gastro-Termine im Hospitly-Look (Bauvorgabe termine-gestaltung 20.10.2026). Tokens und Schrift kommen aus src/c2.css
   (bauen.mjs setzt den :root-Block und die Plus-Jakarta-Schriften davor). Keine neuen Farben: Kategorie-Toene aus
   --c2-toenung, --c2-hell, --c2-warn, --c2-papier. Deckende Flaechen, 1-px-Rand, Radius 8 (Plaketten 4), keine Schatten. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
/* Silbentrennung nach der Sprache der Seite (html lang); break-word nur als Rueckfall fuer ueberlange Woerter (Zack 20.10.2026) */
body.tk { -webkit-hyphens: auto; hyphens: auto; margin: 0; background: var(--c2-grund); color: var(--c2-tinte); font-family: var(--c2-font-text); font-size: var(--c2-fs-16); line-height: var(--c2-lh-16); }
.tk a { color: var(--c2-marke); text-underline-offset: 0.18em; overflow-wrap: break-word; }
.tk a:focus-visible, .tk button:focus-visible { outline: 3px solid var(--c2-orange); outline-offset: 2px; border-radius: 2px; }
/* Grundwerte ohne Spezifitaet (:where), damit die Bausteine darunter ihre Abstaende behalten */
:where(.tk) h1, :where(.tk) h2, :where(.tk) h3 { font-family: var(--c2-font-head); color: inherit; margin: 0; }
:where(.tk) p { margin: 0; }
.tk-wrap { max-width: 1200px; margin: 0 auto; padding: 0 var(--c2-s-48); }
.tk-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 1rem; top: -8rem; background: var(--c2-grund); padding: 1rem; z-index: 99; }
.skip:focus { top: 1rem; outline: 3px solid var(--c2-orange); }
main:focus { outline: none; }
.draft { margin: 0; padding: 10px var(--c2-s-48); text-align: center; background: var(--c2-warn); color: var(--c2-tinte); border-bottom: 1px solid var(--c2-linie); font-size: var(--c2-fs-14); }

/* Kopf wie die Startseite: Bildzeichen + Wortmarke, Textlinks, 2-px-Linie in Orange fuer die aktuelle Seite */
.tk-kopf { background: var(--c2-grund); border-bottom: 1px solid var(--c2-linie); }
.tk-kopf-reihe { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: var(--c2-s-16) var(--c2-s-24); flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
.tk-marke { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.tk-marke-bild { width: 32px; height: 32px; flex: 0 0 auto; background: url(/favicon.svg) center / contain no-repeat; }
.tk-wortmarke { font-family: var(--c2-font-marke); font-weight: 700; font-size: 24px; line-height: 32px; letter-spacing: -0.5px; color: var(--c2-marke); }
.tk-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--c2-s-24); }
.tk-nav-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--c2-tinte) !important; text-decoration: none; border-bottom: 2px solid transparent; }
.tk-nav-link:hover, .tk-nav-link[aria-current="page"] { border-bottom-color: var(--c2-orange); }
.tk-sprache { color: var(--c2-grau) !important; font-size: var(--c2-fs-14); }

/* Band oben wie das Markenband der Startseite */
.tk-held { background: var(--c2-tief); color: var(--c2-hell); padding: var(--c2-s-48) 0 var(--c2-s-40); }
.tk-held h1 { font-size: var(--c2-fs-40); line-height: var(--c2-lh-40); letter-spacing: -0.02em; }
.tk-held a { color: var(--c2-hell); }
.tk-unterzeile { margin-top: var(--c2-s-12); max-width: 760px; font-size: var(--c2-fs-18); line-height: var(--c2-lh-18); color: var(--c2-hell); }
.tk-zurueck { margin-bottom: var(--c2-s-12); font-size: var(--c2-fs-14); }
.tk-knoepfe { display: flex; flex-wrap: wrap; gap: var(--c2-s-12); margin-top: var(--c2-s-24); }
.tk-knopf { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 18px; border-radius: var(--c2-r-4);
  border: 1px solid var(--c2-marke); background: var(--c2-grund); color: var(--c2-marke) !important; font-weight: 700; font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); text-decoration: none; white-space: nowrap; }
.tk-knopf:hover { background: var(--c2-toenung); }
.tk-knopf-primaer { background: var(--c2-orange); border-color: var(--c2-orange); color: var(--c2-tinte) !important; }
.tk-knopf-primaer:hover { background: var(--c2-orange-hover); border-color: var(--c2-orange-hover); }
.tk-knopf-zweit { border-color: var(--c2-linie); }

.tk-abschnitt { padding: var(--c2-s-48) 0; }
.tk-abschnitt h2, .tk-monat h2 { font-size: var(--c2-fs-24); line-height: var(--c2-lh-24); margin-bottom: var(--c2-s-20); }
.tk-abo, .tk-methode { background: var(--c2-papier); border-top: 1px solid var(--c2-linie); }
.tk-abo p, .tk-methode p { max-width: 820px; }
.tk-methode p + p { margin-top: var(--c2-s-12); }

/* Jahresuebersicht: 8 Mini-Monate im Stil des Freelancer-Kalenders (Raster 7 Spalten, Tageszellen Radius 6) */
.tk-jahr { background: var(--c2-papier); border-bottom: 1px solid var(--c2-linie); }
.tk-minis { display: grid; gap: var(--c2-s-16); grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tk-mini { min-width: 0; background: var(--c2-grund); border: 1px solid var(--c2-linie); border-radius: var(--c2-r-8); padding: var(--c2-s-12); }
.tk-mini-kopf { display: block; margin-bottom: 6px; font-weight: 700; font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); color: var(--c2-tinte); text-decoration: none; }
a.tk-mini-kopf { color: var(--c2-marke); }
a.tk-mini-kopf:hover { text-decoration: underline; }
.tk-mini-leer .tk-mini-kopf, .tk-mini-leer .tk-mini-zahl { color: var(--c2-grau); }
.tk-raster { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px 0; }
.tk-wt { text-align: center; font-size: var(--c2-fs-12); line-height: var(--c2-lh-12); font-weight: 600; color: var(--c2-grau); padding: 4px 0; }
.tk-tag { display: block; text-align: center; padding: 5px 0; font-size: var(--c2-fs-12); line-height: var(--c2-lh-12); color: var(--c2-tinte); border-radius: 6px; position: relative; text-decoration: none; }
a.tk-tag-ev { background: rgba(11, 79, 74, 0.12); color: var(--c2-marke); font-weight: 700; }
a.tk-tag-ev::after { content: ""; position: absolute; left: 50%; bottom: 1px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--c2-marke); }
a.tk-tag-ev:hover { background: rgba(11, 79, 74, 0.24); }
a.tk-band { border-radius: 0; }
a.tk-band-anfang { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
a.tk-band-ende { border-top-right-radius: 6px; border-bottom-right-radius: 6px; }
.tk-mini-zahl { margin-top: 6px; font-size: var(--c2-fs-13); line-height: var(--c2-lh-13); color: var(--c2-grau); }
.tk-monat-seite { max-width: 320px; margin: var(--c2-s-32) 0 var(--c2-s-16); }

/* Monatsleiste mit Filtern: klebt beim Scrollen */
.tk-leiste { position: sticky; top: 0; z-index: 20; background: var(--c2-grund); border-bottom: 1px solid var(--c2-linie); padding: var(--c2-s-8) 0; }
.tk-chips, .tk-filter-gruppe { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.tk-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px var(--c2-s-24); margin-top: 6px; }
.tk-filter[hidden] { display: none; }
.tk-filter-name { font-size: var(--c2-fs-13); line-height: var(--c2-lh-13); font-weight: 700; color: var(--c2-grau); margin-right: 2px; }
.tk-chip { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 10px; border: 1px solid var(--c2-linie); border-radius: var(--c2-r-4);
  background: var(--c2-grund); color: var(--c2-tinte) !important; font: inherit; font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); text-decoration: none; cursor: pointer; white-space: nowrap; }
a.tk-chip:hover, button.tk-chip:hover { border-color: var(--c2-marke); }
.tk-chip-leer { color: var(--c2-grau) !important; background: var(--c2-papier); cursor: default; opacity: 0.7; }
button.tk-chip[aria-pressed="true"] { background: var(--c2-marke); border-color: var(--c2-marke); color: var(--c2-grund) !important; }
.tk-zaehler { margin-left: auto; font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); font-weight: 700; color: var(--c2-tinte); }

/* Termine nach Monat */
.tk-monate { padding-bottom: var(--c2-s-48); }
.tk-monat { padding-top: var(--c2-s-40); scroll-margin-top: 140px; }
.tk-monat[hidden] { display: none; }
.tk-monat h2 { padding-bottom: var(--c2-s-12); border-bottom: 2px solid var(--c2-tinte); }
ul.tk-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--c2-s-16); }
.tk-monate > ul.tk-liste { margin-top: var(--c2-s-16); }

/* Event-Karte: Kalenderblatt links, Mitte, Knoepfe rechts (Desktop); am Handy Blatt links neben dem Titel, Knoepfe volle Breite */
.tk-termin { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; grid-template-areas: "blatt mitte knoepfe"; gap: var(--c2-s-20); align-items: start;
  padding: var(--c2-s-20); background: var(--c2-grund); border: 1px solid var(--c2-linie); border-radius: var(--c2-r-8); scroll-margin-top: 140px; min-width: 0; }
.tk-termin[hidden] { display: none; }
.tk-termin:target { border-color: var(--c2-orange); outline: 2px solid var(--c2-orange); outline-offset: -1px; }
.tk-blatt { grid-area: blatt; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 96px; padding: 10px 6px;
  border: 1px solid var(--c2-linie); border-radius: var(--c2-r-8); background: var(--c2-papier); text-align: center; }
.tk-blatt-tag { font-family: var(--c2-font-head); font-weight: 800; font-size: 28px; line-height: 32px; color: var(--c2-tinte); }
.tk-blatt-tag-lang { font-size: 20px; line-height: 26px; }
.tk-blatt-monat { font-size: var(--c2-fs-13); line-height: var(--c2-lh-13); font-weight: 700; color: var(--c2-marke); text-transform: uppercase; letter-spacing: 0.04em; }
.tk-blatt-dauer { font-size: var(--c2-fs-12); line-height: var(--c2-lh-12); color: var(--c2-grau); }
.tk-termin-mitte { grid-area: mitte; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.tk-termin-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: var(--c2-fs-13); line-height: var(--c2-lh-13); color: var(--c2-grau); }
.tk-plakette { display: inline-block; padding: 2px 8px; border-radius: var(--c2-r-4); border: 1px solid var(--c2-linie); font-size: var(--c2-fs-12); line-height: var(--c2-lh-12); font-weight: 700; color: var(--c2-tinte); }
.tk-thema-messen { background: var(--c2-toenung); border-color: var(--c2-toenung); color: var(--c2-marke); }
.tk-thema-branchentreffen { background: var(--c2-hell); }
.tk-thema-wettbewerbe { background: var(--c2-warn); border-color: var(--c2-warn); }
.tk-thema-weiterbildung { background: var(--c2-papier); }
.tk-datum { font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); font-weight: 600; color: var(--c2-marke); }
.tk-termin-titel { font-size: var(--c2-fs-20); line-height: var(--c2-lh-20); overflow-wrap: break-word; }
.tk-termin-text { color: var(--c2-tinte); overflow-wrap: break-word; }
.tk .meta { font-size: var(--c2-fs-13); line-height: var(--c2-lh-13); color: var(--c2-grau); }
.tk .status { font-weight: 700; color: #7b3605; }
.tk-termin-knoepfe { grid-area: knoepfe; display: flex; flex-direction: column; gap: var(--c2-s-8); min-width: 0; }
.tk-termin-knoepfe .tk-knopf { white-space: normal; text-align: center; }
.tk .empty { margin-top: var(--c2-s-24); padding: var(--c2-s-20); background: var(--c2-papier); border: 1px solid var(--c2-linie); border-radius: var(--c2-r-8); }

/* Als Naechstes: drei hervorgehobene Karten nebeneinander */
ul.tk-liste-hervor { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tk-termin-hervor { grid-template-columns: 88px minmax(0, 1fr); grid-template-areas: "blatt mitte" "knoepfe knoepfe"; border-top: 3px solid var(--c2-orange); }
.tk-termin-hervor .tk-blatt { min-height: 88px; }
.tk-termin-hervor .tk-termin-knoepfe { flex-direction: column; }
.tk-termin-hervor .tk-termin-knoepfe .tk-knopf { width: 100%; }

/* Fuss wie die Startseite: dunkle Flaeche */
.tk-fuss { background: var(--c2-tief); color: var(--c2-hell); padding: var(--c2-s-40) 0; font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); }
.tk-fuss p { max-width: 850px; margin-bottom: var(--c2-s-12); }
.tk-fuss a { color: var(--c2-hell); }
.tk-fuss nav { display: flex; flex-wrap: wrap; gap: 4px var(--c2-s-24); }
.tk-fuss nav a { display: inline-flex; align-items: center; min-height: 44px; }
.tk-fuss-marke { color: var(--c2-hell); }
.tk-lesen { max-width: 820px; }
.tk-lesen h2 { margin-top: var(--c2-s-24); font-size: var(--c2-fs-24); line-height: var(--c2-lh-24); }
.tk-lesen p { margin-top: var(--c2-s-12); }

@media (max-width: 1023.98px) {
  .tk-wrap { padding: 0 var(--c2-s-24); }
  .tk-minis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  ul.tk-liste-hervor { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 719.98px) {
  .tk-wrap, .draft { padding-left: var(--c2-s-16); padding-right: var(--c2-s-16); }
  .tk-held { padding: var(--c2-s-32) 0; }
  .tk-held h1 { font-size: var(--c2-fs-32); line-height: var(--c2-lh-32); }
  .tk-abschnitt { padding: var(--c2-s-32) 0; }
  .tk-minis { gap: var(--c2-s-8); }
  .tk-mini { padding: 8px; }
  .tk-termin, .tk-termin-hervor { grid-template-columns: 72px minmax(0, 1fr); grid-template-areas: "blatt mitte" "knoepfe knoepfe"; gap: var(--c2-s-12); padding: var(--c2-s-16); }
  .tk-blatt, .tk-termin-hervor .tk-blatt { min-height: 72px; padding: 8px 4px; }
  .tk-blatt-tag { font-size: 24px; line-height: 28px; }
  .tk-blatt-tag-lang { font-size: 16px; line-height: 20px; }
  .tk-termin-knoepfe, .tk-termin-hervor .tk-termin-knoepfe { flex-direction: column; }
  .tk-termin-knoepfe .tk-knopf { width: 100%; }
  .tk-kopf-reihe { gap: 0; }
  .tk-nav { width: 100%; flex-wrap: nowrap; overflow-x: auto; gap: var(--c2-s-20); scrollbar-width: none; }
  .tk-nav-link { white-space: nowrap; }
  .tk-leiste { position: static; }
  .tk-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .tk-zaehler { margin-left: 0; width: 100%; }
}
@media (max-height: 499.98px) { .tk-leiste { position: static; } }
@media print { .tk-kopf nav, .tk-leiste, .tk-termin-knoepfe, .skip { display: none !important; } .tk-held { background: none; color: var(--c2-tinte); } .tk-held a, .tk-unterzeile { color: var(--c2-tinte); } }

/* "Als Naechstes" (CEO-Abnahme 20.10.2026): Zeitraum-Reiter, Liste nach Tagen (Wirtschaftskalender-Muster), Kartenreihe */
.tk-naechste { padding-bottom: var(--c2-s-32); }
.tk-chips-naechste { margin-bottom: var(--c2-s-8); }
a.tk-chip[aria-current="true"] { background: var(--c2-marke); border-color: var(--c2-marke); color: var(--c2-grund) !important; }
button.tk-chip:disabled { opacity: 0.45; cursor: default; }
.tk-zeitraum-steuer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px var(--c2-s-24); margin-bottom: var(--c2-s-16); }
.tk-zeitraum-steuer[hidden], .tk-zeilen[hidden], .tk-karussell[hidden], .tk-leer-zeitraum[hidden], .tk-zeilen-monat[hidden], .tk-zeilen-tag[hidden], .tk-zeile[hidden], .tk-reihe > li[hidden] { display: none; }
.tk-leer-zeitraum { padding: var(--c2-s-16); background: var(--c2-papier); border: 1px solid var(--c2-linie); border-radius: var(--c2-r-8); }
.tk-zeilen { border: 1px solid var(--c2-linie); border-radius: var(--c2-r-8); overflow: hidden; background: var(--c2-grund); }
.tk-zeilen-monat-titel { padding: 10px var(--c2-s-16); background: var(--c2-tief); color: var(--c2-hell); font-size: var(--c2-fs-16); line-height: var(--c2-lh-16); scroll-margin-top: 16px; }
.tk-tag-kopf { display: flex; align-items: center; gap: var(--c2-s-8); margin: 0; padding: 6px var(--c2-s-16); background: var(--c2-papier); border-top: 1px solid var(--c2-linie);
  font-family: var(--c2-font-text); font-size: var(--c2-fs-13); line-height: var(--c2-lh-13); font-weight: 700; color: var(--c2-grau); }
.tk-heute .tk-tag-kopf { background: var(--c2-warn); color: var(--c2-tinte); }
.tk-heute-marke { padding: 0 6px; border-radius: var(--c2-r-4); background: var(--c2-orange); color: var(--c2-tinte); font-size: var(--c2-fs-12); }
ul.tk-zeilen-liste { list-style: none; margin: 0; padding: 0; }
.tk-zeile { display: grid; grid-template-columns: 112px 52px 150px minmax(0, 1fr) 140px auto; align-items: center; gap: var(--c2-s-12); padding: 8px var(--c2-s-16);
  border-top: 1px solid var(--c2-linie); font-size: var(--c2-fs-14); line-height: var(--c2-lh-14); }
.tk-zeile:hover { background: var(--c2-papier); }
.tk-zeile-datum { font-weight: 700; color: var(--c2-tinte); display: flex; flex-direction: column; }
.tk-zeile-dauer { font-weight: 400; font-size: var(--c2-fs-12); line-height: var(--c2-lh-12); color: var(--c2-grau); }
.tk-land { justify-self: start; padding: 1px 6px; border: 1px solid var(--c2-tinte); border-radius: var(--c2-r-4); font-size: var(--c2-fs-12); line-height: var(--c2-lh-12); font-weight: 700; color: var(--c2-tinte); }
.tk-symbol::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 2px; background: var(--c2-marke); vertical-align: 0; }
.tk-thema-branchentreffen.tk-symbol::before { background: var(--c2-grau); border-radius: 50%; }
.tk-thema-wettbewerbe.tk-symbol::before { background: var(--c2-orange); transform: rotate(45deg); }
.tk-thema-weiterbildung.tk-symbol::before { background: var(--c2-tief); border-radius: 0; }
.tk-zeile-titel { font-weight: 700; color: var(--c2-tinte) !important; text-decoration: none; overflow-wrap: break-word; }
.tk-zeile-titel:hover { text-decoration: underline; }
.tk-zeile-ort { color: var(--c2-grau); overflow-wrap: break-word; }
.tk-zeile-ics { display: inline-flex; align-items: center; min-height: 36px; padding: 4px 10px; border: 1px solid var(--c2-linie); border-radius: var(--c2-r-4); font-weight: 700; font-size: var(--c2-fs-13); text-decoration: none; white-space: nowrap; }
.tk-zeile-ics:hover { border-color: var(--c2-marke); }
/* Kartenreihe: waagrecht, scroll-snap, 3 sichtbar am Rechner, etwa 1,2 am Handy */
.tk-karussell { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--c2-s-8); }
ul.tk-reihe { list-style: none; margin: 0; padding: 4px 2px var(--c2-s-12); display: flex; gap: var(--c2-s-16); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; min-width: 0; }
.tk-reihe > li { flex: 0 0 calc((100% - 2 * var(--c2-s-16)) / 3); scroll-snap-align: start; }
.tk-reihe:focus-visible { outline: 3px solid var(--c2-orange); outline-offset: 2px; }
.tk-pfeil { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--c2-marke); background: var(--c2-grund); color: var(--c2-marke); font-size: 24px; line-height: 1; cursor: pointer; }
.tk-pfeil:hover { background: var(--c2-toenung); }
.tk-pfeil:disabled { opacity: 0.35; cursor: default; background: var(--c2-grund); }
@media (prefers-reduced-motion: no-preference) { ul.tk-reihe { scroll-behavior: smooth; } }
@media (max-width: 1023.98px) {
  .tk-reihe > li { flex-basis: calc((100% - var(--c2-s-16)) / 2.2); }
  .tk-zeile { grid-template-columns: 96px 48px minmax(0, 1fr) auto; grid-template-areas: "datum land titel ics" "datum art ort ics"; row-gap: 4px; }
  .tk-zeile-datum { grid-area: datum; } .tk-land { grid-area: land; } .tk-zeile-art { grid-area: art; } .tk-zeile-titel { grid-area: titel; } .tk-zeile-ort { grid-area: ort; } .tk-zeile-ics { grid-area: ics; }
}
@media (max-width: 719.98px) {
  .tk-karussell { grid-template-columns: minmax(0, 1fr); }
  .tk-pfeil { display: none; }
  .tk-reihe > li { flex-basis: 82%; }
  .tk-zeile { grid-template-columns: 72px minmax(0, 1fr) auto; grid-template-areas: "datum titel ics" "land ort ics" "art art art"; padding: 10px 12px; }
  .tk-zeile-art { justify-self: start; }
  .tk-zeitraum-steuer { justify-content: flex-start; }
}