/* System-Fontstack, keine Remote-Fonts (CSP-konform) */
:root { --radius: 16px; --container: 1100px; --shadow: 0 10px 30px rgba(0,0,0,.2); }
html { box-sizing: border-box; }
*,*::before,*::after { box-sizing: inherit; }
body { margin: 0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, Noto Sans, "Apple Color Emoji","Segoe UI Emoji"; line-height: 1.45; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--accent); text-decoration: none; }
.container { width: min(100% - 2rem, var(--container)); margin-inline: auto; }
.hidden { display: none; }

/* Theming via data-theme: neon | leaf | mono */
html[data-theme="neon"] {
  --bg: #0b0c10; --surface:#12141a; --text:#e6e7ee; --muted:#a2a5b3;
  --accent:#7c3aed; --accent-contrast:#fff; --ring:#9f67ff;
  --gradient: radial-gradient(60% 60% at 20% 10%, rgba(124,58,237,.2), transparent 60%),
              radial-gradient(50% 50% at 90% 10%, rgba(16,185,129,.18), transparent 60%);
}
html[data-theme="leaf"] {
  --bg: #0f1a12; --surface:#162118; --text:#e9f4ea; --muted:#adc9b3;
  --accent:#22c55e; --accent-contrast:#0b1a10; --ring:#7ae189;
  --gradient: radial-gradient(60% 60% at 20% 10%, rgba(34,197,94,.16), transparent 60%),
              radial-gradient(50% 50% at 90% 10%, rgba(190,242,100,.12), transparent 60%);
}
html[data-theme="mono"] {
  --bg: #ffffff; --surface:#f6f6f6; --text:#111; --muted:#666;
  --accent:#111; --accent-contrast:#fff; --ring:#000;
  --gradient: none;
}

body { background: var(--bg); color: var(--text); background-image: var(--gradient); min-height: 100svh; }

.site-header { display:flex; justify-content: space-between; align-items:center; padding: 1rem 0; }
.brand { display:flex; align-items:center; gap:.8rem; font-weight:700; letter-spacing:.2px; }

/* Logo deutlich größer und mit Glow wie im Screenshot 1 */
.brand-logo {
  height: 44px; width: auto; display:block; border-radius: 999px;
}
html[data-theme="neon"] .brand-logo { filter: drop-shadow(0 0 14px rgba(124,58,237,.55)); }
html[data-theme="leaf"] .brand-logo { filter: drop-shadow(0 0 14px rgba(34,197,94,.45)); }
html[data-theme="mono"] .brand-logo { filter: drop-shadow(0 0 10px rgba(0,0,0,.35)); }

.wordmark { font-size:1.2rem; font-weight:800; opacity:.95; }

.nav-actions { display:flex; gap:.5rem; }

.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1rem; border-radius: var(--radius); border:1px solid transparent; cursor:pointer; font-weight:600; }
.btn.accent { background: var(--accent); color: var(--accent-contrast); box-shadow: var(--shadow); }
.btn.ghost { background: transparent; color: var(--text); border-color: color-mix(in oklab, var(--text) 22%, transparent); }
.btn:hover { transform: translateY(-1px); }
.btn:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }

.hero { display:grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items:center; padding: 3rem 0; }
.hero h1 { font-size: clamp(1.8rem, 1.2rem + 2vw, 3rem); margin:0 0 .6rem; }
.lead { color: var(--muted); max-width: 60ch; }
.cta-row { display:flex; gap:.8rem; margin: 1rem 0 1.2rem; }

.qr-card { background: var(--surface); padding: 1rem; border-radius: calc(var(--radius) + 4px); box-shadow: var(--shadow); text-align:center; border:1px solid color-mix(in oklab, var(--text) 10%, transparent); }
.qr-card figcaption { color: var(--muted); margin-top:.5rem; }

.bullets { list-style:none; padding:0; margin:1rem 0 0; display:grid; gap:.3rem; color: var(--muted); }

.info { padding: 2rem 0 3rem; }
.cards { display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; }
.card { background: var(--surface); padding:1.2rem; border-radius: var(--radius); border:1px solid color-mix(in oklab, var(--text) 10%, transparent); }
.card h3 { margin:.2rem 0 .4rem; }
.card p { color: var(--muted); }

.site-footer { padding: 2rem 0 3rem; color: var(--muted); }

/* Event Banner */
.event { background: linear-gradient(90deg, color-mix(in oklab, var(--accent) 35%, transparent), transparent 80%); border-block:1px solid color-mix(in oklab, var(--accent) 30%, transparent); }
.event.hidden { display:none; }
.event .event-inner { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding: 1rem 0; }
.event .eyebrow { text-transform:uppercase; letter-spacing:.12em; font-size:.75rem; color: var(--muted); margin:0 0 .2rem; }
.event h2 { margin:.1rem 0 .3rem; font-size: clamp(1.1rem, .6rem + 1.2vw, 1.6rem); }
.event .muted { color: var(--muted); }

/* Utility */
.muted { color: var(--muted); }

/* Responsive */
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
  .cards { grid-template-columns: 1fr; }
  .brand-logo { height: 36px; }
}