/*! Create Reality – v2: Nebel-Hintergrund (10.11.2026)
    Wie bei Lavish: der Raum liegt hinten, das Licht kommt aus dem Zeichen selbst. */

html {
	background: #070912 url(../img/nebel.jpg) center / cover no-repeat fixed;
}
/* Sternebenen bleiben, aber leiser: der Nebel bringt eigene Sterne mit */
html::before { opacity: .35; mix-blend-mode: screen; }
html::after  { opacity: .2;  mix-blend-mode: screen; }
@keyframes cr-twinkle  { from { opacity: .35; } to { opacity: .18; } }
@keyframes cr-twinkle2 { from { opacity: .18; } to { opacity: .3; } }

/* Lesbarkeit: weiche Abdunklung hinter der Mitte, ohne Kante */
body#landing::before {
	content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
	background: radial-gradient(ellipse 55% 50% at 50% 46%, rgba(7,9,18,.55) 0%, rgba(7,9,18,.25) 55%, rgba(7,9,18,0) 80%);
}

/* Licht aus dem Logo: zweistufiger Schein, innen klar, außen weit */
.hero__logo {
	max-width: 760px;
	filter: drop-shadow(0 0 2px rgba(255,255,255,.55))
	        drop-shadow(0 0 18px rgba(157,180,255,.35))
	        drop-shadow(0 0 60px rgba(120,140,255,.25));
}

.hero__orn {
	display: flex; align-items: center; justify-content: center; gap: 14px;
	margin: 34px 0 0; color: #c5d3ff; font-size: 11px;
	text-shadow: 0 0 8px rgba(197,211,255,.8);
}
.hero__orn::before, .hero__orn::after {
	content: ""; width: 64px; border-top: 1px solid rgba(157,180,255,.45);
}

.hero__tagline {
	margin-top: 26px;
	text-shadow: 0 0 14px rgba(157,180,255,.45);
}
.hero__contact a { text-shadow: 0 0 10px rgba(157,180,255,.35); }

footer { border-top: 1px solid rgba(157,180,255,.14); max-width: 640px; margin: 0 auto; }

@media (max-width: 640px) {
	html { background-position: 62% center; background-attachment: scroll; }
	.hero__orn { margin-top: 26px; }
}
