/* FishLog-Wiki (/wiki/) – eigenständige Stile, unabhängig vom vorgebauten Tailwind-CSS */
.wk-body { background: #f4f8fa; }
.wk-main { padding: 6.5rem 0 4rem; color: #1e293b; }
.wk-wrap { max-width: 1180px; margin: 0 auto; padding: 0 1rem; }
.wk-schmal { max-width: 760px; }
.wk-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.wk-main h1 { font-size: clamp(1.75rem, 3.5vw, 2.4rem); line-height: 1.2; font-weight: 800; color: #084c7c; margin: .4rem 0 .6rem; }
.wk-main a { color: #0b6a96; }
.wk-main a:hover { color: #084c7c; }
.wk-lead { font-size: 1.15rem; line-height: 1.6; color: #334155; max-width: 52rem; }
.wk-wiss { font-style: italic; color: #475569; font-size: 1.05rem; margin: 0 0 .5rem; }

/* Brotkrumen */
.wk-krumen ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; list-style: none; margin: 0; padding: 0; font-size: .9rem; color: #64748b; }
.wk-krumen li + li::before { content: "›"; margin-right: .5rem; color: #94a3b8; }
.wk-krumen a { color: #64748b; text-decoration: none; }
.wk-krumen a:hover { color: #084c7c; text-decoration: underline; }

/* Suche */
.wk-suche { display: flex; gap: .5rem; margin: 1rem 0 1.5rem; max-width: 640px; }
.wk-suche input { flex: 1; min-width: 0; padding: .7rem .9rem; font-size: 1rem; border: 1px solid #cbd5e1; border-radius: .6rem; background: #fff; color: #0f172a; }
/* Eingabefeld erbt sonst die weiße Schrift des Kopfbereichs (Tailwind setzt color: inherit) */
.wk-suche input::placeholder { color: #64748b; opacity: 1; }
.wk-suche input:focus { outline: 3px solid rgba(54, 163, 157, .35); border-color: #36a39d; }
.wk-suche button { padding: .7rem 1.1rem; border: 0; border-radius: .6rem; background: #084c7c; color: #fff; font-weight: 600; cursor: pointer; }
.wk-suche button:hover { background: #0b6a96; }
.wk-suche-gross input { padding: .9rem 1rem; font-size: 1.05rem; }

/* Kopfbereich der Übersicht */
.wk-held { background: linear-gradient(120deg, #084c7c, #36a39d); color: #fff; border-radius: 1.25rem; padding: 2rem 1.5rem; margin: 1rem 0 2rem; }
.wk-held h1 { color: #fff; margin-top: 0; }
.wk-held p { color: #e2f3f2; max-width: 46rem; line-height: 1.6; }
.wk-held .wk-suche input { border-color: transparent; }
.wk-held .wk-suche button { background: #0f172a; }

/* Kategorien und Karten */
.wk-kats { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; margin: 1rem 0 2.5rem; }
.wk-kat { display: block; background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.25rem; text-decoration: none; color: inherit; transition: box-shadow .15s, transform .15s; }
.wk-kat:hover { box-shadow: 0 10px 25px rgba(8, 76, 124, .12); transform: translateY(-2px); }
.wk-kat strong { display: block; font-size: 1.15rem; color: #084c7c; margin-bottom: .35rem; }
.wk-kat span { color: #475569; font-size: .95rem; line-height: 1.5; }
.wk-kat small { display: block; margin-top: .6rem; color: #36a39d; font-weight: 600; }

.wk-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1rem; margin: 1rem 0 2rem; }
.wk-karte { display: flex; flex-direction: column; background: #fff; border: 1px solid #e2e8f0; border-radius: .9rem; overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .15s; }
.wk-karte:hover { box-shadow: 0 8px 20px rgba(8, 76, 124, .12); }
.wk-karte-bild { display: block; aspect-ratio: 16 / 9; background: #fff; }
.wk-karte-bild img { width: 100%; height: 100%; object-fit: contain; display: block; }
.wk-karte-text { display: block; padding: .8rem 1rem 1rem; }
.wk-karte-text strong { display: block; color: #084c7c; font-size: 1.05rem; }
.wk-karte-text em { display: block; color: #64748b; font-size: .85rem; margin: .1rem 0 .35rem; }
.wk-karte-text span { display: block; color: #475569; font-size: .9rem; line-height: 1.45; }

/* A–Z-Liste (Glossar und große Kategorien) */
.wk-az-nav { display: flex; flex-wrap: wrap; gap: .3rem; margin: .5rem 0 1.5rem; }
.wk-az-nav a { display: inline-block; min-width: 2rem; text-align: center; padding: .25rem .4rem; border-radius: .4rem; background: #fff; border: 1px solid #e2e8f0; text-decoration: none; font-weight: 600; }
.wk-az h2 { font-size: 1.4rem; color: #084c7c; border-bottom: 2px solid #36a39d; padding-bottom: .2rem; margin: 2rem 0 .8rem; }
.wk-az ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .6rem 1.5rem; }
.wk-az li a { font-weight: 600; text-decoration: none; }
.wk-az li span { display: block; color: #64748b; font-size: .9rem; line-height: 1.4; }

/* Artikel */
.wk-artikel-raster { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; margin-top: 1rem; }
@media (min-width: 1024px) { .wk-artikel-raster { grid-template-columns: minmax(0, 1fr) 300px; } }
.wk-artikel { background: #fff; border: 1px solid #e2e8f0; border-radius: 1.1rem; padding: 1.5rem; }
@media (min-width: 768px) { .wk-artikel { padding: 2.25rem 2.5rem; } }
.wk-meta { display: flex; flex-wrap: wrap; gap: .4rem 1rem; color: #64748b; font-size: .85rem; margin: .3rem 0 1.2rem; }
.wk-titelbild { margin: 1rem 0 1.5rem; background: #fff; border-radius: .8rem; text-align: center; }
.wk-titelbild img { max-width: 100%; height: auto; border-radius: .8rem; }
.wk-titelbild figcaption { font-size: .85rem; color: #64748b; margin-top: .3rem; }

.wk-inhalt { font-size: 1.05rem; line-height: 1.75; color: #334155; }
.wk-inhalt h2 { font-size: 1.5rem; font-weight: 700; color: #084c7c; margin: 2rem 0 .8rem; scroll-margin-top: 6rem; }
.wk-inhalt h3 { font-size: 1.2rem; font-weight: 700; color: #0f172a; margin: 1.5rem 0 .5rem; scroll-margin-top: 6rem; }
.wk-inhalt h4 { font-size: 1.05rem; font-weight: 700; margin: 1.2rem 0 .4rem; }
.wk-inhalt p { margin: 0 0 1rem; }
.wk-inhalt ul, .wk-inhalt ol { margin: 0 0 1rem 1.4rem; padding: 0; }
.wk-inhalt ul { list-style: disc; }
.wk-inhalt ol { list-style: decimal; }
.wk-inhalt li { margin: .3rem 0; }
.wk-inhalt strong { color: #0f172a; }
.wk-inhalt img { max-width: 100%; height: auto; border-radius: .6rem; margin: .5rem 0; }
.wk-inhalt blockquote { border-left: 4px solid #36a39d; background: #f0f9f8; margin: 1rem 0; padding: .8rem 1rem; border-radius: 0 .6rem .6rem 0; }
.wk-inhalt table { border-collapse: collapse; width: 100%; margin: 1rem 0; font-size: .95rem; display: block; overflow-x: auto; }
.wk-inhalt th, .wk-inhalt td { border: 1px solid #e2e8f0; padding: .5rem .7rem; text-align: left; vertical-align: top; }
.wk-inhalt th { background: #f1f5f9; }
.wk-inhalt a.wk-autolink { text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; }

/* Steckbrief */
.wk-steckbrief { border: 1px solid #cfe7e5; background: #f3fbfa; border-radius: .9rem; padding: 1rem 1.2rem; margin: 0 0 1.5rem; }
.wk-steckbrief h2 { font-size: 1.1rem; margin: 0 0 .6rem; color: #084c7c; }
.wk-steckbrief dl { display: grid; grid-template-columns: minmax(110px, 34%) 1fr; gap: .35rem .9rem; margin: 0; font-size: .97rem; }
.wk-steckbrief dt { font-weight: 600; color: #0f172a; }
.wk-steckbrief dd { margin: 0; color: #334155; }

/* FAQ */
.wk-faq { margin-top: 2rem; }
.wk-faq h2 { font-size: 1.5rem; color: #084c7c; }
.wk-faq details { border: 1px solid #cfe7e5; border-radius: .7rem; margin: .5rem 0; background: #fff; }
.wk-faq summary { cursor: pointer; padding: .8rem 1rem; font-weight: 600; color: #084c7c; }
.wk-faq details > div { padding: 0 1rem 1rem; line-height: 1.65; color: #334155; }

/* Seitenleiste */
.wk-seite { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 1024px) { .wk-seite-innen { position: sticky; top: 6rem; display: flex; flex-direction: column; gap: 1rem; } }
.wk-box { background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1rem 1.1rem; }
.wk-box h2 { font-size: 1rem; font-weight: 700; color: #084c7c; margin: 0 0 .6rem; }
.wk-box ul { list-style: none; margin: 0; padding: 0; font-size: .93rem; }
.wk-box li { margin: .3rem 0; }
.wk-box li.wk-ebene-3 { padding-left: .9rem; font-size: .88rem; }
.wk-box a { text-decoration: none; }
.wk-box a:hover { text-decoration: underline; }
.wk-cta { background: linear-gradient(135deg, #084c7c, #36a39d); color: #fff; border: 0; }
.wk-cta h2, .wk-cta p { color: #fff; }
.wk-cta p { font-size: .93rem; line-height: 1.5; margin: 0 0 .8rem; }
.wk-cta a.wk-knopf { display: inline-block; background: #fff; color: #084c7c; font-weight: 700; padding: .55rem .9rem; border-radius: .6rem; text-decoration: none; }

.wk-hinweis { background: #fff7ed; border: 1px solid #fed7aa; color: #7c2d12; border-radius: .7rem; padding: .8rem 1rem; margin: 0 0 1rem; font-size: .95rem; }
.wk-quellen { margin-top: 2rem; font-size: .9rem; color: #64748b; }
.wk-quellen h2 { font-size: 1.05rem; color: #334155; }
.wk-verwandt h2 { font-size: 1.4rem; color: #084c7c; margin: 2.5rem 0 .5rem; }
.wk-treffer { list-style: none; margin: 0; padding: 0; }
.wk-treffer li { background: #fff; border: 1px solid #e2e8f0; border-radius: .8rem; padding: .9rem 1.1rem; margin: .6rem 0; }
.wk-treffer a { font-weight: 700; font-size: 1.05rem; text-decoration: none; }
.wk-treffer small { color: #36a39d; font-weight: 600; margin-left: .4rem; }
.wk-treffer p { margin: .25rem 0 0; color: #475569; font-size: .95rem; }
.wk-inhalt p > img { display: inline-block; width: auto; max-height: 560px; margin: .5rem .5rem .5rem 0; box-shadow: 0 2px 10px rgba(8, 76, 124, .12); vertical-align: top; }

/* --- SEO-Überarbeitung: Karten mit Titel-Link, Kategorie-Kacheln, Listen, Glossar, Sammelseiten --- */
.wk-karte, .wk-kat, .wk-gruppen-karte { position: relative; }
.wk-karte-link { display: block; color: #084c7c; font-size: 1.05rem; font-weight: 700; text-decoration: none; }
.wk-karte-link::after, .wk-kat h2 a::after { content: ""; position: absolute; inset: 0; }
.wk-karte-link:focus-visible, .wk-kat h2 a:focus-visible { outline: 3px solid #36a39d; outline-offset: 2px; }
.wk-kat h2 { font-size: 1.15rem; margin: 0 0 .35rem; }
.wk-kat h2 a { color: #084c7c; text-decoration: none; }
.wk-kat p { color: #475569; font-size: .95rem; line-height: 1.5; margin: 0; }
.wk-ueber { background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.25rem 1.5rem; margin: 0 0 2rem; }
.wk-ueber h2 { margin-top: 0; }
.wk-box-titel { font-size: 1rem; font-weight: 700; color: #084c7c; margin: 0 0 .6rem; }
.wk-cta .wk-box-titel { color: #fff; }
.wk-namen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .45rem 1.5rem; }
.wk-namen li a { font-weight: 600; text-decoration: none; }
.wk-namen li em { color: #64748b; font-size: .88rem; }
.wk-gruppe h2 { font-size: 1.35rem; color: #084c7c; border-bottom: 2px solid #36a39d; padding-bottom: .2rem; margin: 2rem 0 .8rem; }
.wk-buchstabe { font-size: 1.3rem; font-weight: 800; color: #084c7c; border-bottom: 2px solid #36a39d; padding-bottom: .2rem; margin: 1.6rem 0 .7rem; }
.wk-gruppen-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; margin: 1rem 0 2rem; }
.wk-gruppen-karte { background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.1rem 1.25rem; }
.wk-gruppen-karte h2 { font-size: 1.15rem; margin: 0 0 .2rem; }
.wk-gruppen-karte h2 a { color: #084c7c; text-decoration: none; }
.wk-anzahl { color: #36a39d; font-weight: 600; font-size: .9rem; margin: 0 0 .5rem; }
.wk-namenzeile { font-size: .92rem; line-height: 1.7; margin: 0; color: #64748b; }
.wk-namenzeile a { text-decoration: none; }
.wk-sprung { margin-bottom: 1.25rem; }
.wk-sprung a { min-width: 0; font-weight: 500; }
.wk-glossar { margin: 0; }
.wk-glossar dt { font-size: 1.15rem; font-weight: 700; color: #084c7c; margin: 1.6rem 0 .3rem; scroll-margin-top: 6rem; }
.wk-glossar dfn { font-style: normal; }
.wk-glossar .wk-auch { font-size: .85rem; font-weight: 400; color: #64748b; }
.wk-glossar dd { margin: 0; padding: 0 0 1.1rem; border-bottom: 1px solid #e2e8f0; line-height: 1.65; }
.wk-glossar dd p { margin: .35rem 0; }
.wk-definition { font-weight: 600; color: #1e293b; }
.wk-abschnitt { background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.25rem 1.5rem; margin: 0 0 1.25rem; scroll-margin-top: 6rem; }
.wk-abschnitt h2 { margin-top: 0; color: #084c7c; }
.wk-zurueck { margin-top: 2rem; }
dl.wk-liste dt { font-weight: 700; }
.wk-abschnitt > h3 { margin-top: 0; color: #084c7c; font-size: 1.25rem; }