/* Strayfall – Devlog (14.10.2026): jede Version als Eintrag, das Neueste oben */
.d-page main { padding-top: 68px; }
.nav a[aria-current="page"] { color: var(--gold); opacity: 1; }
.d-hero { padding: 72px 0 28px; background: radial-gradient(ellipse at 50% 0%, rgba(98, 227, 255, 0.12), transparent 60%); }
.d-hero h1 { font-size: clamp(2.6rem, 7vw, 4.6rem); text-transform: uppercase; }
.d-hero .lead { max-width: 760px; }

.d-index { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.d-index a { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255, 255, 255, 0.05); color: var(--text);
  text-decoration: none; font: 700 1rem var(--head); letter-spacing: 0.06em; text-transform: uppercase; }
.d-index a:hover { border-color: rgba(242, 199, 102, 0.6); color: var(--gold); }

/* Zeitleiste: Linie links, je Version ein Punkt */
.d-list { position: relative; max-width: 940px; padding-top: 24px; padding-bottom: 40px; }
.d-list::before { content: ""; position: absolute; left: 35px; top: 40px; bottom: 60px; width: 2px;
  background: linear-gradient(180deg, var(--cyan), rgba(98, 227, 255, 0.15) 70%, transparent); }
.d-entry { position: relative; margin-left: 48px; padding: 28px 30px 30px; margin-bottom: 28px; border-radius: var(--radius);
  border: 1px solid var(--line); background: linear-gradient(180deg, var(--panel), var(--bg-2)); scroll-margin-top: 90px; }
.d-entry::before { content: ""; position: absolute; left: -20px; top: 36px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--bg); border: 3px solid var(--cyan); box-shadow: 0 0 0 4px var(--bg); }
.d-entry.latest { border-color: rgba(242, 199, 102, 0.45); box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35); }
.d-entry.latest::before { border-color: var(--gold); }

.d-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.d-ver { font: 700 1.5rem/1 var(--head); color: #1a1205; background: linear-gradient(180deg, var(--gold), var(--gold-2)); padding: 5px 12px 4px; border-radius: 8px; }
.d-meta time { color: var(--muted); font: 600 1.05rem var(--head); letter-spacing: 0.06em; text-transform: uppercase; }
.d-tag { padding: 3px 10px; border-radius: 999px; font: 700 0.85rem var(--head); text-transform: uppercase; letter-spacing: 0.1em;
  background: rgba(98, 227, 255, 0.12); color: var(--cyan); }
.d-tag.d-fix { background: rgba(255, 255, 255, 0.08); color: var(--muted); }
.d-entry h2 { font-size: clamp(1.9rem, 3.6vw, 2.6rem); margin-top: 14px; }
.d-intro { color: var(--muted); margin-top: 10px; }

.d-shot { margin: 20px 0 0; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); background: var(--bg-2); }
.d-shot img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.d-shot figcaption { padding: 8px 14px; color: var(--muted); font-size: 0.95rem; border-top: 1px solid var(--line); }

.d-points { margin: 18px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.d-points li { position: relative; padding-left: 26px; color: #d6deea; }
.d-points li::before { content: "✦"; position: absolute; left: 0; top: 0.05em; color: var(--gold); font-size: 0.95em; }
.d-points b { color: var(--text); }
.d-note { margin-top: 16px; padding: 12px 16px; border-radius: 10px; border: 1px solid rgba(242, 199, 102, 0.35);
  background: rgba(242, 199, 102, 0.07); color: #e9d9a6; font-size: 1rem; }

.d-follow { max-width: 940px; padding-bottom: 96px; }
.d-follow-box { margin-left: 48px; padding: 28px 30px; border-radius: 20px; border: 1px solid rgba(98, 227, 255, 0.25);
  background: radial-gradient(ellipse at 0% 0%, rgba(98, 227, 255, 0.08), transparent 60%), var(--panel); }
.d-follow-box h2 { font-size: clamp(1.9rem, 3.6vw, 2.6rem); }
.d-follow-box p { color: var(--muted); margin-top: 10px; }
.d-follow-box .socials { justify-content: flex-start; margin-top: 22px; }

@media (max-width: 820px) {
  .d-list::before, .d-entry::before { display: none; }
  .d-entry, .d-follow-box { margin-left: 0; padding: 22px 18px 24px; }
  .d-hero { padding: 48px 0 20px; }
}
@media (max-width: 640px) {
  .nav { display: none; }
}
