/* Gemeinsames Styling für Impressum, Datenschutz und 404 — Tokens wie index.html */
@font-face { font-family: "Inter"; src: url("../fonts/inter-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
:root { --background:#faf9f7; --foreground:#1c1917; --card:#fff; --muted:#f0ece6; --muted-foreground:#6b6560; --border:#eae5de; --brand:#e8722a; --brand-active:#c25a1a; --brand-muted:#fdeadd; --ink-faint:#7d766e; --gradient-brand:linear-gradient(135deg,#fb923c 0%,#e8722a 100%); }
*, *::before, *::after { box-sizing: border-box; }
body { margin:0; background:var(--background); color:var(--foreground); font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:15px; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.topbar { position:sticky; top:0; z-index:40; height:68px; display:flex; align-items:center; gap:12px; padding:0 40px; background:rgba(255,255,255,.88); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
.topbar img { height:34px; }
.topbar .name { font-weight:700; font-size:15px; letter-spacing:-.02em; text-decoration:none; }
.topbar .back { margin-left:auto; text-decoration:none; font-size:13px; font-weight:600; padding:8px 16px; border-radius:999px; background:var(--muted); }
.topbar .back:hover { background:var(--brand-muted); color:var(--brand-active); }
.wrap { max-width:760px; margin:0 auto; padding:64px 24px 80px; }
.eyebrow { display:flex; align-items:center; gap:10px; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.14em; color:var(--muted-foreground); margin:0 0 14px; }
.eyebrow::before { content:"✦"; color:var(--brand); }
h1 { font-size:clamp(34px,5vw,48px); font-weight:800; letter-spacing:-.035em; line-height:1.05; margin:0 0 24px; }
h1 .grad { background-image:var(--gradient-brand); -webkit-background-clip:text; background-clip:text; color:transparent; }
h2 { font-size:22px; font-weight:700; letter-spacing:-.02em; margin:40px 0 10px; }
h3 { font-size:16px; font-weight:600; margin:22px 0 6px; }
p, li { color:#44403c; }
p { margin:0 0 12px; }
ul { padding-left:20px; }
.card { background:var(--card); border:1px solid #f3ede4; border-radius:16px; padding:22px 24px; margin:16px 0; }
.card p { margin:0 0 4px; }
.note { border-left:3px solid var(--brand); background:#faf7f2; padding:12px 16px; border-radius:0 12px 12px 0; font-size:13.5px; color:var(--muted-foreground); }
.todo { background:#fef3c7; color:#92400e; padding:1px 6px; border-radius:6px; font-weight:600; }
footer { border-top:1px solid var(--border); padding:24px 40px; font-size:13px; color:var(--ink-faint); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
footer a { text-decoration:none; margin-left:18px; }
footer a:hover { color:var(--foreground); }
.center { text-align:center; padding-top:120px; }
.center h1 { font-size:clamp(64px,14vw,140px); margin-bottom:8px; }
.btn { display:inline-flex; align-items:center; min-height:46px; padding:0 22px; border-radius:999px; background:var(--brand); color:#fff; font-weight:600; font-size:14px; text-decoration:none; margin-top:20px; }
.btn:hover { background:var(--brand-active); }
@media (max-width:920px) { .topbar, footer { padding-left:20px; padding-right:20px; } .wrap { padding-top:40px; } }
