/* kunst-stipendium — consumes ArtistFolio "Editorial Gallery OS" tokens (_af-tokens.css).
   One accent (Ultramarin), one font (Inter), 8pt grid, quiet museum UI. Dark-mode inherited. */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; font-optical-sizing: auto; }
body {
  margin: 0; background: var(--af-paper); color: var(--af-ink);
  font-family: var(--af-sans); font-size: var(--af-step-0); line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
a { color: var(--af-accent); text-decoration: none; }
a:hover { color: var(--af-accent-hover); text-decoration: underline; }
img { max-width: 100%; height: auto; }
h1,h2,h3 { font-family: var(--af-sans); font-weight: var(--fw-semibold); line-height: 1.12; color: var(--af-ink); letter-spacing: var(--af-track-tight); margin: 0 0 .4em; }
h1 { font-size: clamp(2rem, 1.4rem + 2.6vw, var(--af-step-5)); letter-spacing: var(--af-track-display); font-weight: var(--fw-bold); }
h2 { font-size: var(--af-step-3); margin: var(--af-s7) 0 var(--af-s4); }
h3 { font-size: var(--af-step-1); margin: var(--af-s4) 0 var(--af-s2); }
p { margin: 0 0 1em; }
.muted { color: var(--af-ink-muted); }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 var(--af-s5); }
.skip { position: absolute; left: -999px; }
.skip:focus { left: var(--af-s2); top: var(--af-s2); background: var(--af-surface); padding: var(--af-s2) var(--af-s4); z-index: 100; }
/* W2 (2026-07-11): Standard-Muster fuer Screenreader-only Text neben dekorativen Icons. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Uppercase editorial meta label */
.eyebrow, .label-caps { font-size: var(--af-step-fluid-xs); text-transform: uppercase; letter-spacing: var(--af-track-caps); color: var(--af-ink-muted); font-weight: var(--fw-medium); }

/* ── Header ─────────────────────────────────────────────────────────── */
.site-header { background: color-mix(in srgb, var(--af-paper) 82%, transparent); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); border-bottom: var(--af-rule); position: sticky; top: 0; z-index: 90; }
.site-header .wrap { display: flex; align-items: center; gap: var(--af-s5); height: 64px; }
.brand { font-weight: var(--fw-bold); font-size: var(--af-step-1); color: var(--af-ink); display: flex; align-items: center; gap: var(--af-s2); letter-spacing: var(--af-track-tight); }
.brand:hover { text-decoration: none; color: var(--af-ink); }
.brand .mark { width: 26px; height: 26px; border-radius: var(--af-r-xs); background: var(--af-accent); color: var(--af-accent-ink); display: grid; place-items: center; font-size: .95rem; font-weight: var(--fw-bold); }
.nav { margin-left: auto; display: flex; gap: var(--af-s5); align-items: center; }
.nav a { color: var(--af-ink-muted); font-size: var(--af-step--1); font-weight: var(--fw-medium); }
.nav a:hover { color: var(--af-ink); text-decoration: none; }
.nav .btn { color: var(--af-accent-ink); }
@media (max-width: 780px){ .nav a.hide-sm { display:none; } .site-header .wrap{ gap: var(--af-s3); } .brand{ white-space: nowrap; } }

/* ── Buttons — neutral by default, Ultramarin for the one key action ──── */
.btn { display: inline-flex; align-items: center; gap: var(--af-s2); background: var(--af-accent); color: var(--af-accent-ink); padding: 9px 18px; border-radius: var(--af-r-pill); font-weight: var(--fw-semibold); font-size: var(--af-step--1); border: 1px solid var(--af-accent); cursor: pointer; transition: background var(--af-dur-fast) var(--af-ease), border-color var(--af-dur-fast) var(--af-ease); }
.btn:hover { background: var(--af-accent-hover); border-color: var(--af-accent-hover); text-decoration: none; color: var(--af-accent-ink); }
.btn-ghost { background: transparent; color: var(--af-ink); border: 1px solid var(--af-hairline); }
.btn-ghost:hover { background: var(--af-accent-tint); border-color: var(--af-accent); color: var(--af-accent); }
.btn-block { width: 100%; justify-content: center; }

/* ── Hero ───────────────────────────────────────────────────────────── */
.hero { border-bottom: var(--af-rule); }
.hero .wrap { padding: var(--af-s8) var(--af-s5) var(--af-s7); }
.hero h1 { max-width: 14ch; }
.hero p.lead { font-size: var(--af-step-1); color: var(--af-ink-muted); max-width: 60ch; font-weight: var(--fw-regular); }
.searchbar { display: flex; gap: var(--af-s2); margin-top: var(--af-s6); max-width: 640px; }
.searchbar input[type=search]{ flex: 1; padding: 14px 18px; font-size: var(--af-step-1); border: 1px solid var(--af-hairline); border-radius: var(--af-r-pill); background: var(--af-surface); color: var(--af-ink); font-family: inherit; }
.searchbar input:focus { outline: 2px solid var(--af-accent); outline-offset: 1px; }
.hero-stats { display: flex; gap: var(--af-s7); margin-top: var(--af-s6); flex-wrap: wrap; }
.hero-stats b { font-size: var(--af-step-3); display: block; color: var(--af-ink); font-weight: var(--fw-bold); letter-spacing: var(--af-track-tight); }
.hero-stats span { font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted); text-transform: uppercase; letter-spacing: var(--af-track-md); }

/* ── Universal filter bar — quiet editorial (mirrors ArtistFolio 16-filter-nav) ── */
.filterbar { position: sticky; top: 64px; z-index: 80; background: color-mix(in srgb, var(--af-paper) 82%, transparent); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); border-bottom: var(--af-rule); }
.filterbar__inner { display: flex; align-items: center; gap: 0 var(--af-s5); max-width: 1120px; margin: 0 auto; padding: 0 var(--af-s5); min-height: 46px; overflow-x: auto; scrollbar-width: none; }
.filterbar__inner::-webkit-scrollbar { display: none; }
.filterbar__group { display: inline-flex; align-items: center; gap: var(--af-s2); flex: 0 0 auto; }
.filterbar__group + .filterbar__group { border-left: var(--af-rule); padding-left: var(--af-s5); }
.filterbar__legend { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); }
.filterbar select, .filterbar__search { font-family: inherit; font-size: var(--af-step--1); color: var(--af-ink); background: transparent; border: 0; border-bottom: 1px solid transparent; padding: 4px 2px; cursor: pointer; font-weight: var(--fw-medium); }
.filterbar select:hover { color: var(--af-accent); }
.filterbar select:focus { outline: none; border-bottom-color: var(--af-accent); }
.filterbar select.is-set { color: var(--af-accent); font-weight: var(--fw-semibold); border-bottom: 1px solid var(--af-accent); }
.filterbar__search { border-bottom: 1px solid var(--af-hairline); min-width: 150px; cursor: text; }
.filterbar__search:focus { outline: none; border-bottom-color: var(--af-accent); }
.filterbar__link { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); padding: 4px 0; }
.filterbar__link:hover { color: var(--af-accent); text-decoration: none; }
.filterbar__link.is-active { color: var(--af-ink); font-weight: var(--fw-semibold); box-shadow: inset 0 -2px 0 var(--af-accent); }
.filterbar__reset { margin-left: auto; font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps); color: var(--af-ink-muted); flex: 0 0 auto; }
.filterbar noscript button { font: inherit; }

/* ── Section head ───────────────────────────────────────────────────── */
.results-head { display: flex; align-items: baseline; justify-content: space-between; margin: var(--af-s6) 0 var(--af-s4); flex-wrap: wrap; gap: var(--af-s2); }
.results-head .count { color: var(--af-ink-muted); font-size: var(--af-step-fluid-sm); text-transform: uppercase; letter-spacing: var(--af-track-md); }

/* ── Grant cards — editorial, sharp, hairline ───────────────────────── */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: var(--af-s4); }
.card { background: var(--af-surface); border: var(--af-rule); border-radius: var(--af-r-sm); padding: var(--af-s4); display: flex; flex-direction: column; gap: var(--af-s2); transition: border-color var(--af-dur-fast) var(--af-ease), box-shadow var(--af-dur-fast) var(--af-ease); }
.card:hover { border-color: var(--af-ink-faint); box-shadow: var(--af-shadow-sm); }
.card .org { font-size: var(--af-step-fluid-xs); color: var(--af-ink-muted); text-transform: uppercase; letter-spacing: var(--af-track-caps); }
.card h3 { margin: 0; font-size: var(--af-step-1); line-height: 1.2; }
.card h3 a { color: var(--af-ink); }
.card h3 a:hover { color: var(--af-accent); }
.card .excerpt { font-size: var(--af-step--1); color: var(--af-ink-muted); margin: 0; }
.card .meta { display: flex; flex-wrap: wrap; gap: var(--af-s1) var(--af-s3); margin-top: auto; padding-top: var(--af-s2); font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted); align-items: center; }
.card .meta .dl { font-weight: var(--fw-medium); color: var(--af-ink-muted); }

/* ── Tags / badges ──────────────────────────────────────────────────── */
.tags { display: flex; flex-wrap: wrap; gap: var(--af-s1); }
.tag { font-size: var(--af-step-fluid-xs); background: var(--af-paper); border: var(--af-rule); color: var(--af-ink-muted); padding: 2px 9px; border-radius: var(--af-r-pill); }
.badge { font-size: var(--af-step-fluid-xs); font-weight: var(--fw-semibold); padding: 2px 9px; border-radius: var(--af-r-pill); display: inline-block; text-transform: uppercase; letter-spacing: var(--af-track-sm); }
.badge.ok { background: color-mix(in srgb, var(--af-success) 14%, transparent); color: var(--af-success); }
.badge.warn { background: color-mix(in srgb, var(--af-warning) 16%, transparent); color: var(--af-warning); }
.badge.info { background: var(--af-accent-tint); color: var(--af-accent); }
.badge.muted { background: var(--af-paper); color: var(--af-ink-muted); }

/* ── Pagination ─────────────────────────────────────────────────────── */
.pager { display: flex; gap: var(--af-s1); justify-content: center; margin-top: var(--af-s7); flex-wrap: wrap; }
.pager a, .pager span { padding: 8px 13px; border: var(--af-rule); border-radius: var(--af-r-xs); font-size: var(--af-step--1); color: var(--af-ink-muted); }
.pager a:hover { border-color: var(--af-accent); color: var(--af-accent); text-decoration: none; }
.pager .cur { background: var(--af-ink); color: var(--af-paper); border-color: var(--af-ink); }

/* ── Detail page ────────────────────────────────────────────────────── */
.detail { display: grid; grid-template-columns: 1fr 320px; gap: var(--af-s7); padding: var(--af-s6) 0 var(--af-s8); }
@media (max-width: 860px){ .detail { grid-template-columns: 1fr; } }
.detail .prose p { color: var(--af-ink-muted); }
.detail .prose h2 { font-size: var(--af-step-2); }
.facts { background: var(--af-surface); border: var(--af-rule); border-radius: var(--af-r-md); padding: var(--af-s5); position: sticky; top: 124px; }
.facts dl { margin: 0; display: grid; gap: var(--af-s3); }
.facts dt { font-size: var(--af-step-fluid-xs); text-transform: uppercase; letter-spacing: var(--af-track-caps); color: var(--af-ink-muted); }
.facts dd { margin: 2px 0 0; font-weight: var(--fw-medium); }
.crumbs { font-size: var(--af-step--1); color: var(--af-ink-muted); padding: var(--af-s4) 0 0; }
.crumbs a { color: var(--af-ink-muted); }
.crumbs a:hover { color: var(--af-accent); }

/* ── Promo boxes ────────────────────────────────────────────────────── */
.promo { border-radius: var(--af-r-md); padding: var(--af-s5); margin: var(--af-s4) 0; }
.promo.artistfolio { background: var(--af-accent-tint); border: 1px solid color-mix(in srgb, var(--af-accent) 24%, transparent); }
.promo.artistfolio h3 { color: var(--af-accent); margin-top: 0; }
.promo.artistfolio p { color: var(--af-ink-muted); font-size: var(--af-step--1); }
.promo.affiliate { background: var(--af-paper); border: var(--af-rule); }
.promo.affiliate h3 { margin-top: 0; font-size: var(--af-step-1); }
.promo.affiliate p { font-size: var(--af-step--1); color: var(--af-ink-muted); }
.promo .ad-label { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); margin-bottom: var(--af-s1); }

/* ── Editorial article pages ────────────────────────────────────────── */
.article { max-width: 720px; margin: 0 auto; padding: var(--af-s7) var(--af-s5) var(--af-s8); }
.article .lead { font-size: var(--af-step-1); color: var(--af-ink-muted); }
.article ul { padding-left: 1.2em; } .article li { margin: .3em 0; }

/* ── Notices ────────────────────────────────────────────────────────── */
.notice { border-radius: var(--af-r-sm); padding: var(--af-s3) var(--af-s4); margin: var(--af-s4) 0; font-size: var(--af-step--1); }
.notice-warn { background: color-mix(in srgb, var(--af-warning) 12%, transparent); border: 1px solid color-mix(in srgb, var(--af-warning) 40%, transparent); color: var(--af-warning); }
.notice-info { background: var(--af-accent-tint); border: 1px solid color-mix(in srgb, var(--af-accent) 30%, transparent); }
.notice-info p { color: var(--af-ink); }

/* ── Newsletter ─────────────────────────────────────────────────────── */
.newsletter { background: var(--af-ink); color: var(--af-paper); border-radius: var(--af-r-md); padding: var(--af-s6); margin: var(--af-s7) 0; }
.newsletter h2 { color: var(--af-paper); margin: 0 0 .3em; }
.newsletter p { color: color-mix(in srgb, var(--af-paper) 78%, transparent); }
.newsletter form { display: flex; gap: var(--af-s2); margin-top: var(--af-s3); flex-wrap: wrap; }
.newsletter input[type=email]{ flex: 1; min-width: 220px; padding: 12px 16px; border-radius: var(--af-r-pill); border: 0; font-size: var(--af-step-0); font-family: inherit; }
.newsletter .btn { background: var(--af-paper); color: var(--af-ink); border-color: var(--af-paper); }
.newsletter .btn:hover { background: color-mix(in srgb, var(--af-paper) 88%, var(--af-ink)); }

/* ── Footer ─────────────────────────────────────────────────────────── */
.site-footer { background: var(--af-surface); border-top: var(--af-rule); margin-top: var(--af-s8); }
.site-footer .wrap { padding: var(--af-s7) var(--af-s5); display: grid; grid-template-columns: 2fr 1fr 1fr; gap: var(--af-s6); }
@media (max-width: 700px){ .site-footer .wrap { grid-template-columns: 1fr; } }
.site-footer h4 { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); margin: 0 0 var(--af-s3); }
.site-footer a { display: block; color: var(--af-ink-muted); font-size: var(--af-step--1); padding: 3px 0; }
.site-footer a:hover { color: var(--af-accent); text-decoration: none; }
.site-footer .colophon { font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted); }

/* ── Facets (home) ──────────────────────────────────────────────────── */
.facet { display: flex; flex-direction: column; gap: 0; }
.facet a { color: var(--af-ink-muted); font-size: var(--af-step--1); padding: 5px 0; display: flex; justify-content: space-between; border-bottom: var(--af-rule); }
.facet a:hover { color: var(--af-accent); text-decoration: none; }
.facet a .n { color: var(--af-ink-muted); font-size: var(--af-step-fluid-xs); }

/* ── Consent banner ─────────────────────────────────────────────────── */
.consent { position: fixed; bottom: var(--af-s3); left: var(--af-s3); right: var(--af-s3); max-width: 560px; margin: 0 auto; background: var(--af-ink); color: var(--af-paper); border-radius: var(--af-r-sm); padding: var(--af-s4); z-index: 100; box-shadow: var(--af-shadow-md); font-size: var(--af-step--1); display: none; }
.consent.show { display: block; }
.consent .row { display: flex; gap: var(--af-s2); margin-top: var(--af-s3); }
.consent .btn-ghost { color: var(--af-paper); border-color: color-mix(in srgb, var(--af-paper) 30%, transparent); }
.consent .btn-ghost:hover { background: color-mix(in srgb, var(--af-paper) 12%, transparent); color: var(--af-paper); }

.empty { text-align: center; padding: var(--af-s8) var(--af-s5); color: var(--af-ink-muted); }

/* ── Results tools: count + view toggle ─────────────────────────────── */
.results-tools { display: flex; align-items: center; gap: var(--af-s4); }
.view-toggle { display: inline-flex; border: var(--af-rule); border-radius: var(--af-r-pill); overflow: hidden; }
.view-toggle a { padding: 5px 14px; font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted); font-weight: var(--fw-medium); }
.view-toggle a + a { border-left: var(--af-rule); }
.view-toggle a:hover { color: var(--af-accent); text-decoration: none; }
.view-toggle a.active { background: var(--af-ink); color: var(--af-paper); }
@media (max-width: 700px){ .view-toggle { display: none; } } /* Liste ist ein Desktop-Werkzeug */

/* ── Grant table (desktop list view, sortable heads) ────────────────── */
.table-scroll { overflow-x: auto; border: var(--af-rule); border-radius: var(--af-r-sm); background: var(--af-surface); }
.grant-table { width: 100%; border-collapse: collapse; font-size: var(--af-step--1); min-width: 860px; }
.grant-table th { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--af-ink-faint); font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); font-weight: var(--fw-semibold); white-space: nowrap; position: sticky; top: 0; background: var(--af-surface); }
.grant-table th a { color: inherit; display: inline-block; }
.grant-table th a:hover { color: var(--af-accent); text-decoration: none; }
.grant-table th[aria-sort="ascending"] a, .grant-table th[aria-sort="descending"] a { color: var(--af-accent); }
.grant-table td { padding: 10px 14px; border-bottom: var(--af-rule); vertical-align: top; }
.grant-table tbody tr:hover { background: var(--af-accent-tint); }
.grant-table tbody tr:last-child td { border-bottom: 0; }
.gt-title a { color: var(--af-ink); font-weight: var(--fw-medium); }
.gt-title a:hover { color: var(--af-accent); }
.gt-org, .gt-disc { color: var(--af-ink-muted); }
.gt-deadline { white-space: nowrap; }

/* ── Home chips ─────────────────────────────────────────────────────── */
.chips { display: flex; flex-wrap: wrap; gap: var(--af-s2); margin-top: var(--af-s4); }
.chip { background: var(--af-surface); border: var(--af-rule); border-radius: var(--af-r-pill); padding: 6px 14px; font-size: var(--af-step--1); color: var(--af-ink-muted); }
.chip:hover { border-color: var(--af-accent); color: var(--af-accent); text-decoration: none; }

/* ── Merkliste star (account-free bookmarks, localStorage) ──────────── */
.card { position: relative; }
.save-star { position: absolute; top: 10px; right: 10px; background: transparent; border: 0;
  font-size: 1.05rem; line-height: 1; color: var(--af-ink-muted); cursor: pointer; padding: 4px;
  border-radius: var(--af-r-xs); transition: color var(--af-dur-fast) var(--af-ease); z-index: 2; }
.save-star:hover { color: var(--af-accent); }
.save-star.is-saved { color: var(--af-accent); }

/* ── Featured (paid prominence, clearly labeled) ────────────────────── */
.card--featured { border-color: var(--af-accent); box-shadow: 0 0 0 1px var(--af-accent) inset; }
.featured-flag { font-size: 9px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg);
  color: var(--af-accent); font-weight: var(--fw-semibold); }

/* ── Public forms (Träger-Eintrag) ──────────────────────────────────── */
.submit-form { max-width: 560px; }
.submit-form .field { margin: var(--af-s4) 0; }
.submit-form label { display: block; font-size: var(--af-step-fluid-sm); text-transform: uppercase; letter-spacing: var(--af-track-caps); color: var(--af-ink-muted); margin-bottom: var(--af-s1); font-weight: var(--fw-medium); }
.submit-form input, .submit-form textarea { width: 100%; padding: 10px 14px; border: 1px solid var(--af-hairline); border-radius: var(--af-r-sm); background: var(--af-surface); color: var(--af-ink); font: inherit; }
.submit-form input:focus, .submit-form textarea:focus { outline: 2px solid var(--af-accent); outline-offset: 1px; border-color: var(--af-accent); }

/* ── A11y + finish ──────────────────────────────────────────────────── */
:focus-visible { outline: 2px solid var(--af-accent); outline-offset: 2px; border-radius: 2px; }
::selection { background: var(--af-accent-tint); }
@media print {
  .site-header, .filterbar, .consent, .newsletter, .site-footer, .view-toggle, .promo { display: none !important; }
  /* W17: druckbare Checkliste — Chrome + Nicht-Checklisten-Zusatz weg, reiner Inhalt bleibt. */
  .crumbs, .guide-live-teaser, .author-block, .print-hide { display: none !important; }
  .article { max-width: none; color: #000; }
  a { color: #000; text-decoration: underline; }
  .btn, .btn-ghost { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ── Psychology pass 2026-07-05: honest trust + urgency signals ─────────────── */
.hero .trustline { font-size: var(--af-step--1, .85rem); color: var(--af-ink-muted); margin-top: 10px; }
.hero .trustline b { color: var(--af-ink); font-variant-numeric: tabular-nums; }
.card .verified-dot { font-size: .7rem; font-weight: var(--fw-medium); color: var(--af-ok, #2e7d4f);
  letter-spacing: .02em; white-space: nowrap; }
.card .meta .dl--amber { color: var(--af-warning); }
.card .meta .dl--red   { color: var(--af-danger); font-weight: var(--fw-semibold, 600); }
.card .dl--unverified  { color: var(--af-ink-muted); font-style: italic; }
/* Apply-Box (Runde 2): Bewerbungs-Anforderungen als klarer Handlungs-Block */
.apply-box { margin-top: 16px; padding: 14px 16px; border: 1px solid var(--af-line);
  background: var(--af-paper-2, var(--af-paper)); font-size: .85rem; line-height: 1.55; }
.apply-box h3 { margin: 0 0 8px; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; }
.apply-box .apply-check { list-style: none; margin: 0 0 10px; padding: 0; }
.apply-box .apply-check li { padding-left: 1.3em; position: relative; }
.apply-box .apply-check li::before { content: "✓"; position: absolute; left: 0; color: var(--af-ok, #2e7d4f); font-weight: 600; }
/* Compliance-Audit 2026-07-05: Eigenwerbe-Label + Featured-Kennzeichnung in Tabellenansicht */
.promo .ad-label { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--af-ink-muted); margin-bottom: 4px; }
.featured-flag-inline { font-size: .65rem; text-transform: uppercase; letter-spacing: .04em; color: var(--af-ink-muted); border: 1px solid var(--af-line); padding: 1px 5px; margin-left: 6px; white-space: nowrap; }
tr.row--featured td { background: color-mix(in srgb, var(--af-accent, #2D4A8B) 4%, transparent); }

/* ══ EDITORIAL-WUMS-PASS 2026-07-05 (Design-Plan P1–P5, CI-invariant: nur Token-EINSATZ) ══
   Entscheidungen: Fahrplan-Präzision statt Anzeigetafel · rechteckige Hairline-Plakette ·
   keine Countups. Magazin-Ton: Hairlines, Rubriken, EIN lauter Moment pro Viewport. */

/* ── P1: Typografisches Rückgrat ─────────────────────────────────────── */
.hero .wrap { padding: clamp(56px, 9vw, 104px) var(--af-s5) clamp(40px, 6vw, 72px); }
.hero h1 { font-size: clamp(2.6rem, 1.7rem + 3.6vw, 4.1rem); max-width: 12ch; line-height: 1.04; }
.hero p.lead { margin-top: var(--af-s3); }
h2 { letter-spacing: var(--af-track-tight); }
b, strong, .hero-stats b, .facts dd { font-variant-numeric: tabular-nums; }
.wrap > h2, .results-head h2 { font-size: var(--af-step-3); }

/* Rubriken: nummerierte Eyebrows (Views liefern .rubrik) */
.rubrik { display: flex; align-items: baseline; gap: var(--af-s3); margin: var(--af-s8) 0 var(--af-s4); border-top: 1px solid var(--af-ink); padding-top: var(--af-s3); }
.rubrik .no { font-size: var(--af-step--1); font-weight: var(--fw-bold); color: var(--af-accent); font-variant-numeric: tabular-nums; letter-spacing: var(--af-track-caps); }
.rubrik h2 { margin: 0; font-size: var(--af-step-2); }
.rubrik .more { margin-left: auto; font-size: var(--af-step--1); white-space: nowrap; }

/* ── P2: Die Frist als Held (Fahrplan) ───────────────────────────────── */
.card .meta { display: block; margin-top: auto; padding-top: var(--af-s3); }
.card .meta > span { display: inline-flex; align-items: center; margin-right: var(--af-s3); }
.card .dl-block { display: block; border-top: var(--af-rule); margin-top: var(--af-s2); padding-top: var(--af-s2); }
.card .dl-eyebrow { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); margin-bottom: 1px; }
.card .dl-date { display: block; font-size: var(--af-step-2); font-weight: var(--fw-bold); letter-spacing: var(--af-track-tight); color: var(--af-ink); font-variant-numeric: tabular-nums; line-height: 1.1; }
.card .dl-block.u-amber .dl-date, .card .dl-block.u-amber .dl-eyebrow b { color: var(--af-warning); }
.card .dl-block.u-red .dl-date,   .card .dl-block.u-red .dl-eyebrow b   { color: var(--af-danger); }
.card .dl-block .dl-eyebrow b { font-weight: var(--fw-semibold); }

/* Detail: Fahrplan-Panel oben in der Aside */
.deadline-panel { border: 1px solid var(--af-ink); padding: var(--af-s4); margin: 0 0 var(--af-s4); }
.deadline-panel .dl-eyebrow { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); display: block; }
.deadline-panel .dl-date { font-size: var(--af-step-4); font-weight: var(--fw-bold); letter-spacing: var(--af-track-tight); font-variant-numeric: tabular-nums; line-height: 1.05; display: block; margin-top: 2px; }
.deadline-panel.u-amber .dl-date { color: var(--af-warning); }
.deadline-panel.u-red   .dl-date { color: var(--af-danger); }
.deadline-panel .dl-sub { font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted); margin-top: var(--af-s1); display: block; }
/* W4: Termin-.ics-Link im Fahrplan-Panel — dezent, wie dl-sub, aber klickbar. */
.deadline-panel .dl-ics-link { font-size: var(--af-step-fluid-sm); color: var(--af-accent); margin-top: var(--af-s2); display: inline-block; }
.deadline-panel .dl-ics-link:hover { color: var(--af-accent-hover); }

/* ── P3: Beweis-Sprache — rechteckige Hairline-Plakette ──────────────── */
.card .verified-dot { font-size: 9px; font-weight: var(--fw-semibold); color: var(--af-accent);
  border: 1px solid color-mix(in srgb, var(--af-accent) 45%, transparent); padding: 2px 6px;
  text-transform: uppercase; letter-spacing: var(--af-track-caps); border-radius: 0; }
.seal-block { border: 1px solid color-mix(in srgb, var(--af-accent) 40%, transparent); padding: var(--af-s3) var(--af-s4); margin-top: var(--af-s4); font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted); }
.seal-block .seal-head { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-accent); font-weight: var(--fw-semibold); margin-bottom: 2px; }
.hero .trustline { border-left: 2px solid var(--af-accent); padding-left: var(--af-s3); margin-top: var(--af-s5); max-width: 62ch; }
.card .dl--unverified { font-style: normal; font-size: var(--af-step-fluid-sm); color: var(--af-ink-muted);
  border: 1px dashed var(--af-hairline); padding: 3px 8px; }

/* ── P4: Editorial-Rhythmus ──────────────────────────────────────────── */
.facet a { padding: 7px 0; }
.facet a .n { font-variant-numeric: tabular-nums; font-size: var(--af-step--1); color: var(--af-ink-muted); }
.filterbar select.is-set { border-bottom-width: 2px; }
.filterbar__link.is-active { box-shadow: inset 0 -2px 0 var(--af-accent); }
.article { max-width: 68ch; }
.article > p:first-of-type { font-size: var(--af-step-1); color: var(--af-ink); }
.site-footer { border-top: 1px solid var(--af-ink); }
.site-footer .wrap { padding-top: var(--af-s8); }
.newsletter { border-radius: 0; }
.promo, .facts, .card, .notice, .apply-box, .table-scroll { border-radius: 0; } /* scharfe Kanten konsequent */
.btn { border-radius: 0; }
.searchbar input[type=search] { border-radius: 0; }
.tag, .badge, .chip, .view-toggle, .pager a, .pager span { border-radius: 0; }
.newsletter input[type=email] { border-radius: 0; }

/* ── P5: Mikro-Motion (150ms Präzision, kein Lärm) ───────────────────── */
.card { transition: border-color var(--af-dur-fast) var(--af-ease); }
.card:hover { border-color: var(--af-accent); box-shadow: none; }
.card:hover h3 a { color: var(--af-accent); }
.facet a { transition: color var(--af-dur-fast) var(--af-ease), padding-left var(--af-dur-fast) var(--af-ease); }
.facet a:hover { padding-left: 4px; }
.chip { transition: border-color var(--af-dur-fast) var(--af-ease), color var(--af-dur-fast) var(--af-ease); }

/* ── P6: Mobil-Feinschliff ───────────────────────────────────────────── */
@media (max-width: 700px){
  .hero h1 { font-size: clamp(2.1rem, 8.5vw, 2.6rem); }
  .card .dl-date { font-size: var(--af-step-1); }
  .deadline-panel .dl-date { font-size: var(--af-step-3); }
  .rubrik { flex-wrap: wrap; }
}

/* ══ FRESH-PASS v2 2026-07-05 — mutigere Farbe, Logo-Haltung, ruhigere Motion (Jan/Claude-Design) ══
   Zielgruppe Studierende: professionell, aber frischer Akzent + strukturelle Details. */

:root:not([data-theme="dark"]) {
  --af-accent: #3A63E8;            /* Königsblau, etwas leichter (Jan 2026-07-06) — weiß darauf 5.2:1 (AA) */
  --af-accent-hover: #2A4CC9;
  --af-accent-tint: #EBEFFD;
  --ks-pop: #9AD6B0;               /* F13: Jade — kühler, cleaner Pop */
  --ks-pop-ink: #082415;
  --af-warning: #C9337E;           /* „Läuft bald ab" — Magenta */
  --af-danger: #C23A2B;            /* „Dringend" — frischeres Brick-Rot */
  --af-success: #2E7D55;
}
[data-theme="dark"], :root:not([data-theme="light"]) {
  --ks-pop: #8FCBA6; --ks-pop-ink: #0B2415;
}
/* GUARD (Claude 2026-07-05): Jans Frisch-Palette ist licht-gedacht; ohne diesen Block schlägt
   Königsblau auf Dark-OS durch (gleiche Spezifität, später geladen). Dark behält seinen hellen
   Akzent für Kontrast. */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --af-accent:#6E8FD6; --af-accent-hover:#8AA6E0; --af-accent-tint:rgba(110,143,214,.16); }
}

.badge { font-weight: var(--fw-bold); }
.badge.warn { background: var(--af-warning); color: #FFFDF7; }
.badge.red { background: var(--af-danger); color: #FFF6F4; }
.badge.ok { background: transparent; border: 1px solid var(--af-hairline); color: var(--af-ink-muted); font-weight: var(--fw-semibold); }

.card { position: relative;
  transition: border-color var(--af-dur-fast) var(--af-ease),
              transform var(--af-dur-fast) var(--af-ease),
              box-shadow var(--af-dur-fast) var(--af-ease); }
.card::before { content: ""; position: absolute; top: -1px; bottom: -1px; left: -1px; width: 3px;
  background: var(--af-accent); opacity: 0; transition: opacity var(--af-dur-fast) var(--af-ease); }
.card:hover { border-color: var(--af-accent); transform: translateY(-2px);
  box-shadow: 0 6px 16px -10px color-mix(in srgb, var(--af-accent) 40%, transparent); }
.card:hover::before { opacity: 1; }
.card:hover h3 a { color: var(--af-accent); }
.card h3 a { transition: color var(--af-dur-fast) var(--af-ease); }
.card--featured::before { opacity: 1; }

.save-star { transition: color var(--af-dur-fast) var(--af-ease), transform var(--af-dur-fast) var(--af-ease-emph); }
.save-star:hover { transform: scale(1.15); }
.save-star.is-saved { animation: ks-star-pop var(--af-dur) var(--af-ease-emph); }
@keyframes ks-star-pop { 0% { transform: scale(.7); } 60% { transform: scale(1.22); } 100% { transform: scale(1); } }

.btn { transition: background var(--af-dur-fast) var(--af-ease), border-color var(--af-dur-fast) var(--af-ease), transform var(--af-dur-fast) var(--af-ease); }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-ghost { transition: background var(--af-dur-fast) var(--af-ease), border-color var(--af-dur-fast) var(--af-ease), color var(--af-dur-fast) var(--af-ease), transform var(--af-dur-fast) var(--af-ease); }
.btn-ghost:hover { transform: translateY(-1px); }
.btn-ghost:active { transform: translateY(0); }

.chip { transition: border-color var(--af-dur-fast) var(--af-ease), color var(--af-dur-fast) var(--af-ease), background var(--af-dur-fast) var(--af-ease); }
.chip:hover { background: var(--af-accent-tint); }

.badge.info { background: var(--ks-pop); color: var(--ks-pop-ink); font-weight: var(--fw-bold); }
.filterbar__link.is-active { box-shadow: inset 0 -3px 0 var(--ks-pop); }
.facet a:hover { background: linear-gradient(var(--ks-pop), var(--ks-pop)) left bottom / 100% 34% no-repeat; }

@media (prefers-reduced-motion: reduce){
  .card, .card::before, .btn, .btn-ghost, .chip, .save-star { transition: none !important; transform: none !important; animation: none !important; }
}

.dl--amber { color: var(--af-warning); }
.dl--red { color: var(--af-danger); font-weight: var(--fw-semibold); }

/* ── Fahrplan-Liste (Startseite): Kopfzeile + Zeilen-Struktur ── */
.ks-listhead { display: grid; gap: 24px; align-items: center; padding: 0 0 8px; border-bottom: 1px solid var(--af-ink); margin-top: 8px; }
.ks-listhead button, .ks-listhead span { font: inherit; font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg);
  color: var(--af-ink-muted); font-weight: var(--fw-semibold); background: none; border: 0; cursor: default;
  display: inline-flex; align-items: center; gap: 4px; padding: 6px 0; transition: color var(--af-dur-fast) var(--af-ease); }
.ks-listhead a { cursor: pointer; }
.ks-listhead a:hover { color: var(--af-accent); text-decoration: none; }
.ks-listhead .is-sorted { color: var(--af-ink); box-shadow: inset 0 -3px 0 var(--ks-pop); }
/* .ks-frow: reusable compact list row (Fahrplan on the homepage AND the mobile "Liste"
   view everywhere else, partials/grant-row.php). Exactly 4 children (date, link, tags,
   star) — the ≤700px override below repositions them by nth-child, so the child ORDER
   in grant-row.php must match. */
.ks-frow {
  display: grid; grid-template-columns: 130px 1fr auto auto; gap: 24px; align-items: baseline;
  padding: 14px 12px; border-bottom: 1px solid var(--af-hairline);
  transition: background var(--af-dur-fast) var(--af-ease), box-shadow var(--af-dur-fast) var(--af-ease); box-shadow: inset 3px 0 0 transparent;
}
.ks-frow:hover { background: var(--af-accent-tint); box-shadow: inset 3px 0 0 var(--af-accent); }
.ks-frow .ks-ftitle { transition: color var(--af-dur-fast) var(--af-ease); }
.ks-frow:hover .ks-ftitle { color: var(--af-accent); }
.ks-frow__date { display: flex; flex-direction: column; }
.ks-frow__date b { font-size: var(--af-step-2); font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; letter-spacing: -.01em; line-height: 1.1; }
.ks-frow__days { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--af-ink-muted); }
.ks-frow__link { display: flex; flex-direction: column; gap: 2px; min-width: 0; color: inherit; text-decoration: none; }
.ks-frow__org { font-size: var(--af-step-fluid-xs); text-transform: uppercase; letter-spacing: .08em; color: var(--af-ink-muted); }
.ks-frow__tags { display: flex; gap: 8px; align-items: center; }

/* ── Sparten-Index (Startseite) ── */
.ks-idx { transition: color var(--af-dur-fast) var(--af-ease), padding-left var(--af-dur-fast) var(--af-ease); }
.ks-idx:hover { color: var(--af-accent); padding-left: 8px; text-decoration: none; }
.ks-idx:hover > span:first-child { background: linear-gradient(var(--ks-pop), var(--ks-pop)) left bottom / 100% 30% no-repeat; }

/* ── Karten-Raster beruhigen (feste Zonen) ── */
.card .excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: calc(2 * 1.6em); }
.card .tags { flex-wrap: nowrap; overflow: hidden; min-height: 23px; max-height: 23px; margin-top: auto; }
.card .tags .tag { white-space: nowrap; flex: 0 0 auto; }
.card .meta { display: flex; align-items: center; gap: var(--af-s3); margin-top: 0; padding-top: 0; flex-wrap: nowrap; }
.card .meta > span { flex: 0 0 auto; display: inline-flex; align-items: center; margin-right: 0; }
.card .meta > span:not(.badge):not(.verified-dot) { flex: 0 1 auto; min-width: 0; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card .excerpt + .meta, .card .excerpt + .dl-block { margin-top: auto; }
.card .meta .verified-dot { margin-left: auto; }
.badge { display: inline-flex; align-items: center; height: 22px; line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap; }
.card .verified-dot { display: inline-flex; align-items: center; height: 22px; }

/* ── Filterbar v2: gefasste Kontroll-Boxen ── */
@media (min-width: 701px){ .filterbar__inner { flex-wrap: wrap; row-gap: 8px; padding-top: 10px; padding-bottom: 10px; } }
@media (max-width: 700px){
  .filterbar { position: relative; }
  .filterbar::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 36px; background: linear-gradient(to right, transparent, var(--af-paper)); pointer-events: none; }
  .filterbar__inner { padding-top: 8px; padding-bottom: 8px; }
}
.filterbar__inner { gap: 8px 8px; }
.filterbar__group { border: 1px solid var(--af-hairline); background: var(--af-surface); padding: 5px 12px; gap: var(--af-s2); min-height: 36px; transition: border-color var(--af-dur-fast) var(--af-ease), background var(--af-dur-fast) var(--af-ease); }
.filterbar__group + .filterbar__group { border-left: 1px solid var(--af-hairline); padding-left: 12px; }
.filterbar__group:hover { border-color: var(--af-ink-faint); }
.filterbar select { font-weight: var(--fw-semibold); padding: 2px 0; }
.filterbar select.is-set { border-bottom: 0; }
.filterbar__group:has(select.is-set) { border-color: var(--af-accent); background: var(--af-accent-tint); }
.filterbar__group:has(select.is-set) .filterbar__legend { color: var(--af-accent); }
.filterbar__link { padding: 6px 4px; }
.filterbar__link.is-active { color: var(--af-ink); font-weight: var(--fw-bold); box-shadow: inset 0 -3px 0 var(--ks-pop); }
.filterbar__search { border-bottom: 0; min-width: 160px; }
.filterbar__group:has(.filterbar__search:focus) { border-color: var(--af-accent); }
.filterbar__reset { align-self: center; padding: 6px 0; }
.filterbar__reset:hover { color: var(--af-accent); text-decoration: none; }
.filterbar__row2 { border-top: 1px solid var(--af-hairline); }
@media (min-width: 701px){ .filterbar__row2 { padding-top: 10px; } }

/* ── Homepage-Delights (aus Startseite.dc.html) ── */
@keyframes ks-rowin { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes ks-pulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
.ks-row { animation: ks-rowin .32s cubic-bezier(.2,0,0,1) both; }
.ks-live-dot { display:inline-block; width:7px; height:7px; border-radius:0; background: var(--af-danger); animation: ks-pulse 1.4s ease-in-out infinite; }
#ks-hero { transition: opacity 240ms cubic-bezier(.2,0,0,1); }
#ks-hero.ks-hero-fading { opacity: 0; }
.view-toggle a { cursor: pointer; }

/* ── Mobil-Härtung Fahrplan + Index (≤700px) ── */
@media (max-width: 700px){
  /* Fahrplan-Zeile: Datum+Tage oben-links, Stern oben-rechts, Titel VOLLE Breite (kein Turm), Meta darunter */
  .ks-frow { grid-template-columns: 1fr auto !important; gap: 3px 12px !important; padding: 16px 12px !important; }
  .ks-frow > :nth-child(1) { grid-column: 1 !important; grid-row: 1 !important; flex-direction: row !important; align-items: baseline; gap: 8px; }
  .ks-frow > :nth-child(4) { grid-column: 2 !important; grid-row: 1 !important; align-self: start; }
  .ks-frow > :nth-child(2) { grid-column: 1 / -1 !important; grid-row: 2 !important; }
  .ks-frow > :nth-child(3) { grid-column: 1 / -1 !important; grid-row: 3 !important; margin-top: 2px; }
  .ks-frow b { font-size: var(--af-step-1) !important; }
  .ks-frow .ks-ftitle { font-size: var(--af-step-0) !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .ks-frow > :nth-child(2) > span:first-child { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  /* Listenkopf: als schlichte Link-Zeile (Frist / Stipendium) */
  .ks-listhead { display: flex !important; gap: 16px; }
  .ks-listhead > :nth-child(3), .ks-listhead > :nth-child(4) { display: none; }
  .ks-idx { flex-wrap: wrap; row-gap: 2px; }
  .ks-idx > span:last-child { margin-left: 0 !important; flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce){ .ks-row, .ks-live-dot { animation: none !important; } }

/* ── Filterbar: 4 wichtigste + „Mehr Filter", mobil ausklappbar (Jan-Wunsch 2026-07-05) ──
   ALLES progressive: nur unter html.js verstecken/klappen — ohne JS bleiben ALLE Filter sichtbar. */
.filterbar__toggle { display: none; }
.filterbar__more { display: none; }

/* „Mehr Filter"-Umschalter (Desktop + Mobile, nur mit JS) */
html.js .filterbar__more { display: inline-flex; align-items: center; font: inherit; font-size: 10px;
  text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); font-weight: var(--fw-bold);
  color: var(--af-accent); background: var(--af-surface); border: 1px solid var(--af-hairline);
  min-height: 36px; padding: 5px 12px; cursor: pointer; flex: 0 0 auto; transition: border-color var(--af-dur-fast) var(--af-ease); }
html.js .filterbar__more:hover { border-color: var(--af-accent); }
.filterbar__more .fm-less { display: none; }
.filterbar.show-more .filterbar__more .fm-more { display: none; }
.filterbar.show-more .filterbar__more .fm-less { display: inline; }
html.js .filterbar__group--more { display: none; }
html.js .filterbar.show-more .filterbar__group--more { display: inline-flex; }

@media (max-width: 700px){
  .filterbar { position: sticky; top: 64px; }
  .filterbar::after { display: none; }
  /* Aufklapp-Kopf nur mit JS; ohne JS bleibt die Bar als scrollbare Zeile (base) sichtbar */
  html.js .filterbar__toggle { display: flex; align-items: center; justify-content: space-between; gap: 10px;
    width: 100%; font: inherit; font-size: var(--af-step--1); font-weight: var(--fw-semibold);
    color: var(--af-ink); background: transparent; border: 0; padding: 12px var(--af-s5); cursor: pointer; }
  .filterbar__toggle .fb-dot { display: inline-block; width: 7px; height: 7px; background: var(--af-accent); margin-left: 6px; }
  .filterbar__toggle .chev { transition: transform var(--af-dur-fast) var(--af-ease); font-size: .8em; color: var(--af-ink-muted); }
  .filterbar.is-open .filterbar__toggle .chev { transform: rotate(180deg); }
  html.js .filterbar__inner { display: none; flex-direction: column; align-items: stretch; overflow: visible;
    padding: 0 var(--af-s5) var(--af-s4); gap: 8px; }
  html.js .filterbar.is-open .filterbar__inner { display: flex; }
  html.js .filterbar.is-open.show-more .filterbar__group--more { display: flex; }
  .filterbar__group { width: 100%; justify-content: space-between; }
  .filterbar__group + .filterbar__group { border-left: 0; padding-left: 12px; }
  html.js .filterbar__more { width: 100%; justify-content: center; }
  .filterbar__reset { width: 100%; text-align: left; padding-top: 4px; }
}

/* ── „nah dran nur leicht rot" (Jan 2026-07-05): weicheres Dringlichkeits-Rot für Fristen-Daten ── */
:root { --ks-urgent: #D2695A; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --ks-urgent: #E0897C; } }
[data-theme="dark"] { --ks-urgent: #E0897C; }
.dl--red, .card .dl-block.u-red .dl-date, .card .dl-block.u-red .dl-eyebrow b,
.deadline-panel.u-red .dl-date { color: var(--ks-urgent); }
.dl--red { font-weight: var(--fw-semibold); }

/* ── Newsletter: Sparten-/Region-Auswahl bei der Anmeldung (Jan 2026-07-05) ── */
.newsletter .nl-interests { margin: 12px 0 4px; font-size: var(--af-step--1); }
.newsletter .nl-interests > summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 6px;
  color: color-mix(in srgb, var(--af-paper) 82%, transparent); padding: 6px 0; }
.newsletter .nl-interests > summary::-webkit-details-marker { display: none; }
.newsletter .nl-interests > summary::before { content: "▸"; transition: transform var(--af-dur-fast) var(--af-ease); font-size: .8em; }
.newsletter .nl-interests[open] > summary::before { transform: rotate(90deg); }
.newsletter .nl-interests[open] > summary { margin-bottom: 10px; }
.newsletter .nl-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.newsletter .nl-chips label { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; cursor: pointer;
  user-select: none; border: 1px solid color-mix(in srgb, var(--af-paper) 24%, transparent);
  color: color-mix(in srgb, var(--af-paper) 88%, transparent); transition: border-color var(--af-dur-fast) var(--af-ease), background var(--af-dur-fast) var(--af-ease); }
.newsletter .nl-chips input { accent-color: var(--af-accent); margin: 0; }
.newsletter .nl-chips label:hover { border-color: var(--af-paper); }
.newsletter .nl-chips label:has(input:checked) { background: color-mix(in srgb, var(--af-paper) 14%, transparent); border-color: var(--af-paper); color: var(--af-paper); }
.newsletter .nl-region { margin-top: 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.newsletter .nl-region label { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: color-mix(in srgb, var(--af-paper) 60%, transparent); }
.newsletter .nl-region select { font: inherit; padding: 8px 10px; background: transparent; color: var(--af-paper);
  border: 1px solid color-mix(in srgb, var(--af-paper) 24%, transparent); }
.newsletter .nl-region select option { color: #111; }

/* ══ RUHE-PASS 2026-07-06 (Jan): Magenta entschärfen + weniger schwere Linien ══ */

/* Magenta gedämpfter (statt knallig #C9337E) — dark eigene, hellere Nuance */
:root:not([data-theme="dark"]) { --af-warning: #B0497A; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --af-warning: #CF7DA5; } }
[data-theme="dark"] { --af-warning: #CF7DA5; }

/* „Läuft bald ab"/„Noch N Tage" nicht mehr voll gefüllt, sondern ruhig getönt */
.badge.warn { background: color-mix(in srgb, var(--af-warning) 13%, transparent); color: var(--af-warning);
  border: 1px solid color-mix(in srgb, var(--af-warning) 32%, transparent); font-weight: var(--fw-semibold); }
.badge.red { background: color-mix(in srgb, var(--ks-urgent) 13%, transparent); color: var(--ks-urgent);
  border: 1px solid color-mix(in srgb, var(--ks-urgent) 32%, transparent); font-weight: var(--fw-semibold); }

/* Weniger schwere Linien: kräftige Ink-Trennlinien → zarte Haarlinien */
.rubrik { border-top-color: var(--af-hairline); }
.ks-listhead { border-bottom: 1px solid var(--af-hairline); }
.site-footer { border-top: 1px solid var(--af-hairline); }

/* ── Suchfeld schrumpft mit (Jan 2026-07-06): ohne min-width:0 bleibt flex:1 starr und der
   „Suchen"-Button rutscht auf schmalen Screens über den Rand. flex-wrap als Sicherheitsnetz. ── */
.searchbar { flex-wrap: wrap; }
.searchbar input[type=search] { min-width: 0; flex: 1 1 190px; }
.searchbar .btn { flex: 0 0 auto; }
/* Sticky-Header auf eigene Compositor-Ebene → kein Scroll-Ruckeln des Logos (Backdrop-Filter). */
.site-header { transform: translateZ(0); }

/* ── Responsive-Audit-Fixes 2026-07-06 ── */
/* Hero-Größe hierher (Inline schlug sonst die Mobil-Regel); Desktop groß, mobil passt <360px */
#ks-hero { font-size: clamp(2.6rem, 5.4vw, 5.2rem); }
@media (max-width: 700px){ #ks-hero { font-size: clamp(1.9rem, 8vw, 2.6rem); } }
/* Touch-Ziele ≥44px auf Mobil (WCAG 2.5.5): Buttons + Merk-Stern */
@media (max-width: 700px){
  .btn { min-height: 44px; padding: 11px 18px; }
  .searchbar .btn { min-height: 48px; }
}
.save-star { min-width: 40px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; top: 4px; right: 4px; padding: 6px; }
@media (max-width: 700px){ .save-star { min-width: 44px; min-height: 44px; } }
/* Sicherheitsnetz gegen leerzeichenlose Lang-Token (Träger-URLs, E-Mails, Slugs) */
.gt-title a, .card h3, .detail h1, .crumbs, .facts dd, .ks-ftitle, .article { overflow-wrap: anywhere; }

/* ── Mobile-Navigation (Hamburger-Dropdown) + Listen→Karten + Breadcrumbs (Jan 2026-07-06) ── */
.nav-toggle { display: none; background: none; border: 0; cursor: pointer; color: var(--af-ink); font-size: 20px; line-height: 1; }
@media (max-width: 780px){
  html.js .nav-toggle { display: inline-flex; align-items: center; justify-content: center; margin-left: auto; min-width: 44px; min-height: 44px; }
  html.js .nav { position: fixed; top: 64px; left: 0; right: 0; margin: 0; flex-direction: column; align-items: stretch; gap: 0;
    background: var(--af-surface); border-bottom: 1px solid var(--af-hairline); box-shadow: var(--af-shadow-md);
    padding: var(--af-s2) var(--af-s5) var(--af-s5); display: none; z-index: 89; }
  html.js .site-header.nav-open .nav { display: flex; }
  html.js .nav a { display: block !important; padding: 14px 2px; font-size: var(--af-step-0); font-weight: var(--fw-medium);
    color: var(--af-ink); border-bottom: 1px solid var(--af-hairline); }
  html.js .nav a:hover { color: var(--af-accent); }
  html.js .nav .btn { display: flex !important; justify-content: center; margin-top: var(--af-s3); min-height: 48px; border: 1px solid var(--af-accent); }
  html.js .nav-toggle[aria-expanded="true"] { color: var(--af-accent); }
}
/* no-JS: keine Hamburger-Logik → Nav-Links sichtbar lassen (wrappen unter die Bar) */
@media (max-width: 780px){
  html:not(.js) .site-header .wrap { height: auto; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
  html:not(.js) .nav a.hide-sm { display: inline-block; }
}

/* Listen→Karten: Tabelle nur Desktop. Mobil zeigt "Liste" jetzt echte kompakte Zeilen
   (.rowlist, partials/grant-row.php) statt wieder auf Bild-Karten zurückzufallen — nur
   "Karten" bleibt mobil die Bild-Ansicht (2026-07-09, Website-Verbesserungsplan). */
.only-mobile { display: none; }
.rowlist.only-mobile { display: none; }
@media (max-width: 700px){
  .only-desktop { display: none !important; }
  .grid.only-mobile { display: grid; }
  .rowlist.only-mobile { display: block; }
  /* Startseiten-Fahrplan: eigenes Format, unverändert — mobil immer Karten statt Liste */
  #ks-list { display: none !important; }
  #ks-grid { display: block !important; }
  #ks-view-toggle { display: none !important; }
}

/* Breadcrumbs etwas präsenter (Navigation, auch mobil als „wo bin ich") */
.crumbs { padding: var(--af-s4) 0 var(--af-s2); font-size: var(--af-step-fluid-sm); }
.crumbs a { color: var(--af-ink-muted); }
.crumbs a:hover { color: var(--af-accent); }

/* ── Mobile: Hero straffen — Kennzahlen als kompakter Strip, Fahrplan schneller sichtbar (Jan 2026-07-06) ── */
@media (max-width: 700px){
  .hero .wrap { padding-top: 40px !important; padding-bottom: 20px !important; }
  .hero p.lead { margin-top: var(--af-s2); }
  .searchbar { margin-top: var(--af-s4); }
  /* 3 Kennzahlen als eine gefasste Zeile statt drei hohe Blöcke */
  .hero-stats { gap: 0; margin-top: var(--af-s4); border: 1px solid var(--af-hairline); flex-wrap: nowrap; }
  .hero-stats > div { flex: 1 1 0; min-width: 0; text-align: center; padding: 8px 4px; border-right: 1px solid var(--af-hairline); }
  .hero-stats > div:last-child { border-right: 0; }
  .hero-stats b { font-size: var(--af-step-1); }
  .hero-stats span { font-size: 9px; letter-spacing: .03em; display: block; margin-top: 1px; }
  .hero .trustline { margin-top: var(--af-s4); font-size: var(--af-step-fluid-xs); }
  /* Fahrplan direkt hoch: erste Rubrik nach dem Hero enger */
  .wrap > .rubrik:first-child { margin-top: var(--af-s5); }
}
/* Lead mobil kleiner → weniger Zeilen bis zum ersten Stipendium */
@media (max-width: 700px){ .hero p.lead { font-size: var(--af-step-0); line-height: 1.5; } }

/* W11: Fristen-Heatmap "Das Jahr auf einen Blick" — Dichte-Tints aus --af-accent via color-mix(),
   keine neue Farbe erfunden, passt sich Dark-Mode automatisch an (Tokens aendern sich dort selbst). */
.heatmap { display: grid; grid-template-columns: repeat(auto-fit, minmax(76px, 1fr)); gap: var(--af-s2); margin: var(--af-s5) 0 var(--af-s6); }
.heatmap-cell { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: var(--af-s3) var(--af-s2); border: 1px solid var(--af-hairline); text-align: center; color: var(--af-ink); text-decoration: none; transition: border-color var(--af-dur-fast) var(--af-ease); }
a.heatmap-cell:hover { border-color: var(--af-accent); text-decoration: none; }
span.heatmap-cell { color: var(--af-ink-muted); cursor: default; }
.heatmap-month { font-size: 10px; text-transform: uppercase; letter-spacing: var(--af-track-caps-lg); color: var(--af-ink-muted); }
.heatmap-count { font-size: var(--af-step-1); font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; }
.heatmap-t0 { background: var(--af-surface); }
.heatmap-t1 { background: color-mix(in srgb, var(--af-accent) 10%, var(--af-surface)); }
.heatmap-t2 { background: color-mix(in srgb, var(--af-accent) 22%, var(--af-surface)); }
.heatmap-t3 { background: color-mix(in srgb, var(--af-accent) 38%, var(--af-surface)); }
.heatmap-t3 .heatmap-count { color: var(--af-accent); }
.heatmap--mini { grid-template-columns: repeat(6, 1fr); max-width: 520px; margin: var(--af-s4) 0 0; }
.heatmap--mini .heatmap-cell { padding: var(--af-s2) 4px; }
