/* Shared styles for the simple text pages (404, Impressum, Datenschutz). */
html, body { margin: 0; padding: 0; background: #08090A; }
body {
  min-height: 100vh; box-sizing: border-box;
  display: flex; flex-direction: column; align-items: center;
  padding: 96px 24px 64px;
  font-family: 'DM Sans', sans-serif; font-size: 16px; line-height: 1.6; color: #B4B8C0;
  -webkit-font-smoothing: antialiased;
}
main { width: 100%; max-width: 680px; }
h1, h2 { font-family: 'Red Hat Display', sans-serif; font-weight: 600; letter-spacing: -0.02em; color: #F7F8F8; }
h1 { margin: 0 0 32px; font-size: 48px; line-height: 1.05; }
h2 { margin: 40px 0 12px; font-size: 24px; line-height: 1.2; }
p { margin: 0 0 16px; }
a { color: #F7F8F8; text-underline-offset: 3px; }
a:hover { color: #FF41AD; }
:focus-visible { outline: 2px solid #F7F8F8; outline-offset: 3px; }
/* "Go back" button: same size, colours and hover as the home page CTA ("Let's talk"), arrow mirrored */
.back {
  display: inline-flex; align-items: center; gap: 12px; margin-top: 32px;
  height: 64px; padding: 0 32px; border-radius: 999px;
  background: #F7F8F8; color: #08090A; text-decoration: none;
  font-family: 'DM Sans', sans-serif; font-size: 20px; font-weight: 500; line-height: 1;
  transition: background 200ms;
}
.back:hover { color: #08090A; }
.back .arrow { display: inline-flex; align-items: center; transition: transform 200ms ease-in-out; }
.back svg { flex: none; }
@media (hover: hover) {
  .back:hover { background: rgba(247,248,248,0.8); }
  .back:hover .arrow { transform: translateX(-4px); }
}
@media (max-width: 640px) { .back { height: 52px; padding: 0 24px; font-size: 16px; gap: 8px; } }
.todo { padding: 16px 20px; border: 1px dashed #FF41AD; border-radius: 16px; color: #F7F8F8; }
footer { margin-top: auto; padding-top: 64px; font-size: 14px; }
footer a { color: #8A8F98; text-decoration: none; margin: 0 12px; }
footer a:hover { color: #F7F8F8; }
@media (max-width: 640px) { h1 { font-size: 36px; } body { padding-top: 64px; } }