/* Lichtscheibe-Karten: Bild als Hintergrund, nur Licht bewegt sich (Canvas-Intro, Puls, Sterne; kreis.js).
   Rahmen und Text in karte.css. Aus design/html/assets/diwali-gruss-kreis/kreis.css, ohne Gruß-Blatt. */
.bild-box{background:linear-gradient(var(--top),var(--bot))}
.kam{position:absolute;top:0;left:50%;translate:-50% 0;height:100%;aspect-ratio:9/16;will-change:transform}
.kam img{display:block;width:100%;height:100%;object-fit:cover}
/* Bild nach oben gerückt (c.hoch, 08.11.2026), damit der Gruß das Motiv nicht verdeckt: Unterkante läuft in --bot aus */
.kam.hoch img{-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.intro-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.fx{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.puls{position:absolute;border-radius:50%;aspect-ratio:1;background:radial-gradient(circle,rgba(255,205,120,.5),rgba(255,205,120,0) 68%);mix-blend-mode:screen;animation:pl 5s ease-in-out infinite}
@keyframes pl{0%,100%{opacity:.08}50%{opacity:.5}}
.fx i{position:absolute;width:5px;height:5px;border-radius:50%;background:#FFE9A8;box-shadow:0 0 8px 2px rgba(255,214,120,.7);opacity:0;animation:tw 3.6s ease-in-out infinite}
@keyframes tw{0%,100%{opacity:0;transform:scale(.6)}50%{opacity:.9;transform:scale(1)}}
.fx.pause *,.fx.pause i{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.fx{display:none}}