/* Interaktion 2026-10-07: Stufe-3-Effekte („Wow“) – verändern das Design sichtbar, auf ausdrücklichen Wunsch.
   Jeder Block ist einzeln entfernbar. Ganz entfernen: diese Datei + js/interactions-wow.js aus index.html austragen. */

/* ---- W1: Lebendiges Polarlicht im Hero (WebGL, js/interactions-wow.js) ----
   Liegt über dem vorhandenen lila Schimmer (.scene:before = statischer Fallback) und unter Karte/Kugel/Würfel.
   Blendet erst nach dem ersten gezeichneten Bild ein; ohne WebGL / bei „Bewegung reduzieren“ bleibt alles wie vorher. */
.ix-aurora{position:absolute;left:-12%;top:-40px;width:124%;height:calc(100% + 150px);z-index:-2;pointer-events:none;opacity:0;transition:opacity 1.4s var(--ix-out,ease);
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 35%,transparent 100%)}
.ix-aurora.is-on{opacity:1}
@media(prefers-reduced-motion:reduce){.ix-aurora{display:none}}

/* ---- W2: Laufender Lichtrand an der empfohlenen Preiskarte („Business Website“) ----
   Ein heller Lichtbogen wandert langsam über den vorhandenen Rand. Nur GPU-Drehung (keine Neuberechnung pro Bild),
   läuft nur, solange die Karte sichtbar ist (.ix-run per IntersectionObserver). */
.ix-ring{position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;overflow:hidden;z-index:1;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.ix-ring::before{content:'';position:absolute;left:50%;top:50%;width:300%;aspect-ratio:1;translate:-50% -50%;
  background:conic-gradient(from 0deg,transparent 0 58%,color-mix(in srgb,var(--purple) 70%,transparent) 70%,#efe8ff 76%,#f5a3d6 79%,transparent 86%,transparent 100%);
  animation:ix-ring-spin 9s linear infinite;animation-play-state:paused}
.ix-ring.ix-run::before{animation-play-state:running}
@keyframes ix-ring-spin{to{rotate:360deg}}
/* Bewegung reduzieren: der Lichtbogen steht still (Seite schaltet Animationen global ab) */
@media(prefers-reduced-motion:reduce){.ix-ring::before{rotate:35deg}}
@media(prefers-contrast:more){.ix-ring{display:none}}
