/* Intro „Globus“ – frei nachempfunden nach 21st.dev @efferd/not-found-2 (Glow-Bogen), Vanilla. Bleibt, bis „Intro überspringen“ geklickt wird. */
.intro{position:fixed;inset:0;z-index:100;overflow:hidden;background:radial-gradient(120% 80% at 50% 110%,#10213A 0,#0B0E1A 60%);color:#FAF8F4}
.intro.zu{animation:intro-weg .5s cubic-bezier(.7,0,.2,1) forwards}
.intro-wort{position:absolute;left:0;right:0;top:44vh;transform:translateY(-50%);z-index:1;margin:0;max-width:none;text-align:center;font-family:var(--serif,Georgia,serif);font-weight:400;font-size:clamp(3.6rem,13vw,10.5rem);line-height:1;letter-spacing:-.02em;color:transparent;background:linear-gradient(180deg,#FAF8F4 35%,rgba(250,248,244,.35));-webkit-background-clip:text;background-clip:text}
.intro-wort em{background:linear-gradient(90deg,#E8673A,#5B9BFF);-webkit-background-clip:text;background-clip:text}
.globus{position:absolute;left:50%;top:44vh;width:max(170vw,170vh);aspect-ratio:1;margin-left:calc(max(170vw,170vh) / -2);border-radius:50%;pointer-events:none;animation:globus-schweben 9s ease-in-out infinite alternate}
.globus::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(closest-side,rgba(13,26,46,.9) 0,rgba(11,14,26,.6) 92%,transparent 99%);box-shadow:0 0 0 2px rgba(91,155,255,.55),0 0 18px 4px rgba(52,211,153,.6),0 0 70px 18px rgba(91,155,255,.35),0 -30px 140px 40px rgba(52,211,153,.18);filter:blur(4px) saturate(1.3)}
.globus::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 30%,rgba(52,211,153,.35) 40%,transparent 50% 80%,rgba(91,155,255,.35) 90%,transparent);-webkit-mask:radial-gradient(closest-side,transparent 96%,#000 99%,transparent 100%);mask:radial-gradient(closest-side,transparent 96%,#000 99%,transparent 100%);filter:blur(10px);animation:globus-dreh 40s linear infinite}
.intro-skip{position:absolute;right:clamp(1rem,3vw,2rem);bottom:clamp(1rem,3vw,2rem);z-index:2;display:inline-flex;align-items:center;gap:.55rem;font:600 1rem/1 Inter,system-ui,sans-serif;color:#0B0E1A;background:#FAF8F4;border:0;border-radius:999px;padding:1rem 1.4rem;cursor:pointer;box-shadow:0 0 0 1px rgba(250,248,244,.3),0 10px 40px -8px rgba(52,211,153,.6);transition:transform .2s,background .2s}
.intro-skip:hover{background:#fff;transform:translateY(-2px)}
.intro-skip:focus-visible{outline:3px solid #5B9BFF;outline-offset:3px}
.intro-skip svg{width:18px;height:18px}
html.intro-offen,html.intro-offen body{overflow:hidden}
@keyframes globus-schweben{from{transform:translateY(0) rotate(-1.5deg)}to{transform:translateY(-10px) rotate(1.5deg)}}
@keyframes globus-dreh{to{transform:rotate(360deg)}}
@keyframes intro-weg{to{opacity:0;visibility:hidden}}
@media (prefers-reduced-motion:reduce){.intro *,.intro{animation:none!important}.intro.zu{display:none}}
/* v7: sanfte Drehung – weiche, unscharfe Oberfläche wandert horizontal (maskiert auf die Kugel) */
.globus-haut{position:absolute;inset:0;border-radius:50%;overflow:hidden;-webkit-mask:radial-gradient(closest-side,#000 0,#000 78%,transparent 97%);mask:radial-gradient(closest-side,#000 0,#000 78%,transparent 97%);opacity:1}
.globus-haut i{position:absolute;top:0;bottom:0;left:0;width:200%;filter:blur(28px);background-image:radial-gradient(9% 5% at 12% 9%,rgba(91,155,255,.5),transparent 70%),radial-gradient(12% 4% at 30% 5%,rgba(52,211,153,.38),transparent 70%),radial-gradient(8% 6% at 42% 14%,rgba(140,170,255,.36),transparent 70%),radial-gradient(14% 3% at 22% 18%,rgba(91,155,255,.3),transparent 70%),linear-gradient(90deg,transparent 0,rgba(91,155,255,.14) 12%,transparent 25%,rgba(52,211,153,.12) 37%,transparent 50%);background-size:50% 100%;background-repeat:repeat-x;animation:globus-drift 36s linear infinite;will-change:transform}
@keyframes globus-drift{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.globus-haut i{animation:none}}
/* v8: Maus-/Finger-Licht, Fackel am Rand, leichte Parallaxe (JS setzt nur CSS-Variablen/transform) */
.intro{touch-action:none}
.globus-par{position:absolute;inset:0;pointer-events:none;transform-origin:50% 44vh;will-change:transform}
.intro-stage{position:absolute;inset:0;perspective:1400px;pointer-events:none}
.licht{position:absolute;left:0;top:0;width:44vmin;height:44vmin;margin:-22vmin 0 0 -22vmin;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(closest-side,rgba(94,234,212,.30),rgba(56,189,248,.16) 45%,rgba(232,103,58,.06) 70%,transparent);filter:blur(22px);mix-blend-mode:screen;transform:translate3d(-999px,-999px,0);will-change:transform;opacity:.9}
.fackel{position:absolute;left:0;top:0;width:26vmin;height:5vmin;margin:-2.5vmin 0 0 -13vmin;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(closest-side,rgba(204,251,241,.95),rgba(94,234,212,.6) 35%,rgba(56,189,248,.3) 60%,rgba(232,103,58,.08) 80%,transparent);filter:blur(7px);mix-blend-mode:screen;opacity:0;will-change:transform,opacity}
.welle{position:absolute;width:16vmin;height:16vmin;margin:-8vmin 0 0 -8vmin;border-radius:50%;pointer-events:none;z-index:0;box-shadow:0 0 0 2px rgba(94,234,212,.5),0 0 30px 6px rgba(56,189,248,.35);filter:blur(3px);opacity:0;animation:welle 1.1s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes welle{0%{opacity:.8;transform:scale(.2)}100%{opacity:0;transform:scale(1.6)}}
@media (prefers-reduced-motion:reduce){.licht,.fackel,.welle{display:none}.globus-par{transform:none}}
.intro-stage{z-index:0}.licht{z-index:1}.welle{z-index:1}.intro-wort{z-index:2}.intro-skip{z-index:3}
/* v8: Wortmarke-Enthüllung (Buchstaben steigen aus weicher Unschärfe, „i“ landet zuletzt mit Glow) – danach stabil */
.intro-wort{background:none;color:inherit}
.intro-wort .b{display:inline-block;color:transparent;background:linear-gradient(180deg,#FAF8F4 35%,rgba(250,248,244,.35));-webkit-background-clip:text;background-clip:text;opacity:0;filter:blur(14px);transform:translateY(.28em);animation:wort-ein 1s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.15s + var(--i)*90ms)}
.intro-wort em{background:none}
.intro-wort em .b{background:linear-gradient(90deg,#E8673A,#5B9BFF);background-size:400% 100%;background-position:calc(var(--j)*33.33%) 0;-webkit-background-clip:text;background-clip:text;padding-right:.04em}
.intro-wort .i-punkt{animation:wort-ein 1s cubic-bezier(.2,.8,.2,1) forwards,i-pop .7s ease-out forwards;animation-delay:.95s,1.75s}
@keyframes wort-ein{to{opacity:1;filter:blur(0);transform:none}}
@keyframes i-pop{0%{filter:drop-shadow(0 0 0 rgba(232,103,58,0))}35%{filter:drop-shadow(0 0 18px rgba(232,103,58,.75))}100%{filter:drop-shadow(0 0 0 rgba(232,103,58,0))}}
.welle.tipp{width:10vmin;height:10vmin;margin:-5vmin 0 0 -5vmin;animation-duration:.8s}
@media (prefers-reduced-motion:reduce){.intro-wort .b{opacity:1;filter:none;transform:none}}
