/* Nolden.tech Evolution Layer 2026-Q3
   Ziel: Identität bewahren, Substanz erhöhen, mobile/a11y/SEO/Recruiter Experience verbessern. */
:root {
  --terminal-surface: rgba(0, 10, 6, 0.94);
  --terminal-surface-soft: rgba(0, 255, 154, 0.055);
  --terminal-line: rgba(57, 255, 20, 0.32);
  --text-muted: #b7c7bf;
  --text-strong: #f4fff9;
  --warn-amber: #ffd166;
  --danger-red: #ff5c7a;
  --focus-ring: 0 0 0 3px rgba(0, 243, 255, 0.55), 0 0 18px rgba(0, 243, 255, 0.35);
}

html { scroll-behavior: smooth; }
body { min-height: 100vh; line-height: 1.55; }
body.reduced-motion *,
body.reduced-motion *::before,
body.reduced-motion *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

.skip-link {
  position: fixed;
  left: 16px;
  top: 12px;
  transform: translateY(-160%);
  z-index: 7000;
  background: #00140c;
  color: var(--cyber-blue, #00f3ff);
  border: 1px solid var(--cyber-blue, #00f3ff);
  padding: 10px 14px;
  font-family: 'Courier New', monospace;
  text-decoration: none;
}
.skip-link:focus { transform: translateY(0); box-shadow: var(--focus-ring); }

button, a, input, textarea, select, summary { touch-action: manipulation; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible,
.terminal-button:focus-visible, .nav-item:focus-visible { outline: none; box-shadow: var(--focus-ring) !important; border-color: var(--cyber-blue, #00f3ff) !important; }

#main-header { padding: 18px 10px; }
#main-header nav { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px; max-width: 1320px; }
.nav-item, .terminal-button { border-radius: 2px; min-height: 40px; }
.nav-item.active-nav { background: rgba(0,255,154,.14); border-color: var(--neon-green); box-shadow: inset 0 0 12px rgba(0,255,154,.18); color: #fff; }

/* Lesbarkeit: bestehende Identität bleibt, Inline-Styles werden ergänzt statt ersetzt. */
.content-box { scrollbar-gutter: stable; }
.content-box p, .content-box li { color: #d8e7df; }
.content-box h2, .content-box h3, .content-box h4 { color: var(--neon-green); }
.content-box pre, .content-box code { white-space: pre-wrap; word-break: break-word; }

.recruiter-snapshot,
.signal-strip,
.terminal-panel,
.case-study-grid,
.dashboard-grid,
.toolkit-grid,
.knowledge-cluster,
.personality-grid {
  display: grid;
  gap: 14px;
}
.recruiter-snapshot { grid-template-columns: repeat(4, minmax(130px, 1fr)); margin: 22px 0; }
.signal-card,
.terminal-panel,
.dashboard-card,
.tool-card,
.case-card,
.knowledge-card,
.personality-card {
  background: var(--terminal-surface-soft);
  border: 1px solid var(--terminal-line);
  border-left: 3px solid var(--neon-green);
  padding: 14px;
  box-shadow: inset 0 0 20px rgba(0,255,154,.035);
}
.signal-card strong { display:block; color: var(--text-strong); font-family: 'Orbitron', monospace; font-size: .92rem; letter-spacing: 1px; }
.signal-card span { color: var(--text-muted); font-size: .9rem; }
.signal-strip { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin: 18px 0 8px; }
.terminal-panel { margin-top: 18px; }
.terminal-panel header { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom: 1px dashed rgba(57,255,20,.25); padding-bottom: 8px; margin-bottom: 10px; }
.terminal-kicker { color: var(--cyber-blue); font-family: 'Courier New', monospace; font-size: .82rem; }

.dashboard-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.dashboard-card { min-height: 128px; position: relative; overflow: hidden; }
.dashboard-card::after { content:""; position:absolute; inset:auto 10px 10px auto; width:46px; height:46px; border-right:1px solid rgba(0,243,255,.25); border-bottom:1px solid rgba(0,243,255,.25); opacity:.7; }
.metric-label { color: #8fb3a3; font-family: 'Courier New', monospace; font-size: .8rem; text-transform: uppercase; }
.metric-value { color: var(--text-strong); font-family: 'Orbitron', monospace; font-size: 1.35rem; display:block; margin: 5px 0; }
.metric-note { color: var(--text-muted); font-size: .86rem; }
.status-pill { display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(57,255,20,.35); padding:2px 8px; color: var(--neon-green); font-family:'Courier New', monospace; font-size:.78rem; }
.status-pill.warn { color: var(--warn-amber); border-color: rgba(255,209,102,.45); }
.status-pill.blue { color: var(--cyber-blue); border-color: rgba(0,243,255,.45); }

.toolkit-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.tool-card label { display:block; color: var(--text-muted); font-size:.85rem; margin: 10px 0 4px; }
.tool-card input, .tool-card textarea, .tool-card select, .tool-card output {
  width: 100%; box-sizing: border-box; background: #020604; color: var(--neon-green); border: 1px solid rgba(57,255,20,.45); padding: 9px; font-family: 'Courier New', monospace;
}
.tool-card textarea { min-height: 96px; resize: vertical; }
.tool-result { margin-top: 10px; color: #fff; background: rgba(0,0,0,.45); border-left: 2px solid var(--cyber-blue); padding: 10px; font-family:'Courier New', monospace; font-size:.86rem; white-space: pre-wrap; word-break: break-word; }
.tool-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }

.case-study-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin: 16px 0; }
.case-card h4 { margin-top:0; }
.arch-diagram { font-family:'Courier New', monospace; color:#dfffee; background:#000; border:1px solid rgba(0,243,255,.28); padding:14px; overflow:auto; }
.badge-row { display:flex; flex-wrap:wrap; gap:7px; margin:10px 0; }
.tech-badge { border:1px solid rgba(0,243,255,.35); color: var(--cyber-blue); padding:2px 7px; font-family:'Courier New', monospace; font-size:.76rem; }

.knowledge-cluster { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); margin: 18px 0; }
.knowledge-card button { width:100%; text-align:left; }
.guide-card { transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.guide-card:hover, .guide-card:focus-within { transform: translateY(-2px); }
.filter-buttons { flex-wrap: wrap; }
.filter-btn.active, .filter-btn:focus-visible { background: rgba(0,255,154,.16); color:#fff; border-color: var(--neon-green); }

.personality-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.personality-card { border-left-color: var(--cyber-blue); }

/* Final visual polish: remove floating debug/version noise from the visual frame. */
body::after { content: none !important; display: none !important; }
#site-health { display: none !important; }
#site-health button { all: unset; cursor: pointer; margin-left: 8px; color: var(--cyber-blue); }

#home .content-box { max-width: 760px; text-align: center; padding: 18px 40px 24px; }
#home .main-brand-logo { width: clamp(145px, 18vw, 190px) !important; }
#home .logo-container { margin-bottom: 10px; }
#home .status-indicator { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
#home .recruiter-snapshot { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 16px 0; text-align: center; }
#home .signal-card { min-height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 8px 10px; }
#home .signal-card strong { font-size: .84rem; }
#home .signal-card span { font-size: .78rem; line-height: 1.25; }
#home .signal-strip { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 7px; margin: 12px auto; }
#home .system-stats { max-width: 520px; margin: 14px auto; text-align: left; }
#home .system-log { height: clamp(155px, 24vh, 230px) !important; text-align: left; }
#home .quick-links { margin-top: 16px !important; }
.credentials-box { text-align: left; }

.wide-box { max-width: min(1040px, calc(100vw - 48px)); }
#toolbox .content-box, #guides .content-box, #dashboard .content-box { padding: 34px 40px; }
#toolbox h2, #guides h2, #dashboard h2 { text-align: left; line-height: 1.15; }
.toolkit-grid, .dashboard-grid, .guides-grid { align-items: stretch; }
.tool-card, .dashboard-card, .guide-card { min-width: 0; }
.tool-card h4, .dashboard-card h4, .guide-card h3 { line-height: 1.2; }
.tool-card .terminal-button, .guide-card .terminal-button, #tools-grid .terminal-button { display: inline-flex; justify-content: center; align-items: center; }

@media (max-width: 900px) {
  body, html { overflow: hidden; }
  #main-header { align-items:flex-start; background: linear-gradient(to bottom, rgba(0,0,0,.96), rgba(0,0,0,.55)); }
  #main-header nav { justify-content:flex-start; overflow-x:auto; flex-wrap: nowrap; padding: 0 10px 8px; width:100%; }
  .nav-item, .terminal-button { white-space: nowrap; margin: 0; padding: 8px 10px; font-size: .72rem; }
  .page-section { padding: 92px 12px 28px; align-items: flex-start; }
  .content-box { max-height: calc(100vh - 122px); padding: 18px; }
  .recruiter-snapshot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .system-log { height: 260px !important; }
  .about-actions { flex-direction: column; }
  .calc-input-group { flex-direction: column; }
}

@media (max-width: 520px) {
  .recruiter-snapshot, .dashboard-grid, .toolkit-grid, .case-study-grid, .knowledge-cluster { grid-template-columns: 1fr; }
  .main-brand-logo { width: 170px !important; }
  body::after { display:none; }
  #site-health { display: none; }
}
