/* ===== Modern Dark Neon Style (2025 Look) ===== */

/* Grundfarben & Variablen */
:root {
  --bg-dark: #0b0f14;       /* sehr dunkler Hintergrund */
  --bg-soft: #111827;       /* softer Verlauf */
  --accent-cyan: #22d3ee;   /* Neon-Cyan */
  --accent-purple: #8b5cf6; /* Neon-Purple */
  --text-light: #f9fafb;    /* fast weiß */
  --text-muted: #94a3b8;    /* gedämpftes Grau */
}

/* Globaler Hintergrund mit Glow-Spots */
body {
  min-height: 100vh;
  margin: 0;
  background:
          radial-gradient(1000px 800px at 20% 30%, rgba(34, 211, 238, 0.08), transparent 70%),
          radial-gradient(800px 700px at 80% 10%, rgba(139, 92, 246, 0.12), transparent 70%),
          linear-gradient(180deg, var(--bg-dark), var(--bg-soft));
  background-attachment: fixed;
  color: var(--text-light);
  font-family: 'Inter', 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
}
img[alt="Logo Rene Ingenpass"] {
  height: 200px;     /* fixe Höhe */
  width: auto;
}

/* Headlines */
h1, h2, .headline {
  font-weight: 800;
  text-transform: uppercase;
  color: var(--text-light);
  letter-spacing: -1px;
  line-height: 1.1;
}

/* 2025-Outline-Effekt */
h1 span.year {
  font-size: clamp(3rem, 8vw, 6rem);
  font-weight: 900;
  -webkit-text-stroke: 2px var(--text-light);
  text-stroke: 2px var(--text-light);
  color: transparent;
  display: inline-block;
}

/* Glow-Text */
.text-glow {
  text-shadow:
          0 0 18px rgba(34, 211, 238, 0.45),
          0 0 36px rgba(139, 92, 246, 0.35);
}

/* Cards / Glassmorphism */
.lift {
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(12px);
}
.lift:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0,0,0,.55);
  border-color: var(--accent-cyan);
}

/* Gradient border (neon frame) */
.gradient-border {
  border: 2px solid transparent;
  border-radius: 1rem;
  background: linear-gradient(var(--bg-dark), var(--bg-dark)) padding-box,
  linear-gradient(135deg, var(--accent-cyan), var(--accent-purple)) border-box;
}



/* Headlines besser umbrechen */
@supports (text-wrap: balance) {
  .text-balance { text-wrap: balance; }
}
.hyphens-auto { hyphens: auto; }

/* Deko-Linie */
.dotted-line {
  border-top: 1px dashed rgba(255,255,255,0.15);
  position: relative;
}
.dotted-line::after {
  content: "→";
  position: absolute;
  right: 0;
  top: -0.75rem;
  color: var(--accent-cyan);
  font-weight: bold;
}

.ri-typing-cursor { position: relative; }
.ri-typing-cursor::after {
  content: '';
  display: inline-block;
  width: 1ch;
  margin-left: 2px;
  height: 1em;
  vertical-align: -0.2em;
  border-right: 2px solid currentColor;
  animation: ri-caret 0.9s steps(1) infinite;
}
@keyframes ri-caret { 50% { border-right-color: transparent; } }



html, body { overflow-x: clip; }