/* =======================================================================
   Timeline-Erweiterung ([timeline]/[year]) - eigenständiges Basis-CSS,
   wird unabhängig vom aktiven Theme automatisch geladen (siehe
   Nexis\Template\ExtensionAssets). Arbeitet ausschließlich mit den
   geteilten --nx-*-Variablen, damit dieselbe CSS in jedem Theme
   automatisch in dessen eigenen Farben/Formen erscheint, ohne
   Theme-spezifischen Code.
   ======================================================================= */

/* --- große Jahres-Karten im Raster --- */
.nx-timeline-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--nx-space-6); margin: var(--nx-space-8) 0; }
.nx-timeline-card { position: relative; background: var(--nx-surface); border-radius: var(--nx-radius-lg); padding: var(--nx-space-6); box-shadow: var(--nx-shadow-sm); border-top: 4px solid var(--nx-primary); transition: box-shadow 0.2s ease, transform 0.2s ease; }
.nx-timeline-card:hover { box-shadow: var(--nx-shadow); transform: translateY(-2px); }
.nx-timeline-year { font-size: var(--nx-fs-3xl); font-weight: 800; color: var(--nx-primary); line-height: 1; }
.nx-timeline-title { font-weight: 700; margin: var(--nx-space-2) 0 var(--nx-space-2); color: var(--nx-text); }
.nx-timeline-text { color: var(--nx-muted); line-height: var(--nx-lh-base); margin: 0; }
.nx-timeline--planned .nx-timeline-card { border-top: none; border: 2px dashed var(--nx-primary); background: var(--nx-surface-soft); }
.nx-timeline-badge { position: absolute; top: var(--nx-space-4); right: var(--nx-space-4); background: var(--nx-primary); color: var(--nx-on-primary); font-size: var(--nx-fs-sm); font-weight: 700; padding: 0.15em 0.75em; border-radius: 999px; }