/**
 * LT Rotating Rings 1.0.0
 * Assegna la classe lt-rotating-rings alla row Divi.
 * Velocita: aumenta --lt-rings-duration (es. 240s) per rallentare.
 */
.lt-rotating-rings {
  --lt-rings-bg: #141414;
  --lt-rings-color: #ffe100;
  --lt-rings-line: #e8e8e8;
  --lt-rings-duration: 180s;
  --lt-rings-size: 76%;
  --lt-rings-x: 77%;
  --lt-rings-y: 50%;
  --lt-rings-particle-opacity: .26;
  position: relative;
  isolation: isolate;
}

.lt-rotating-rings > .lt-rotating-rings__bg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border-radius: inherit;
  background: var(--lt-rings-bg);
  pointer-events: none !important;
  user-select: none;
  z-index: -1;
}

.lt-rotating-rings__bg > .lt-rotating-rings__svg,
.lt-rotating-rings__bg > .lt-rotating-rings__particles {
  display: block;
  position: absolute;
  width: var(--lt-rings-size);
  max-width: none;
  height: auto;
  left: var(--lt-rings-x);
  top: var(--lt-rings-y);
  transform: translate(-50%, -50%);
  overflow: visible;
  fill: none;
  color: var(--lt-rings-line);
  stroke: currentColor;
  stroke-width: 1;
}

.lt-rotating-rings__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg,
    var(--lt-rings-bg) 0%, var(--lt-rings-bg) 35%, transparent 70%);
}

.lt-rotating-rings__svg .lt-rotating-rings__ring {
  transform-box: view-box;
  transform-origin: 400px 400px;
  animation: lt-rotating-rings-turn var(--lt-rings-duration) linear infinite;
}

.lt-rotating-rings__svg .lt-rotating-rings__outer {
  animation-duration: calc(var(--lt-rings-duration) * 1.333333);
  animation-direction: reverse;
}

.lt-rotating-rings__svg .lt-rotating-rings__inner {
  animation-duration: calc(var(--lt-rings-duration) * .8);
  animation-direction: reverse;
}

.lt-rotating-rings__svg .lt-rotating-rings__accent {
  stroke: var(--lt-rings-color);
  stroke-width: 13;
}

.lt-rotating-rings__bg > .lt-rotating-rings__particles {
  z-index: 2;
  stroke-width: 1.2;
}

.lt-rotating-rings__particles .lt-rotating-rings__particle {
  opacity: 0;
  fill: currentColor;
  stroke: none;
  shape-rendering: crispEdges;
  transform-box: fill-box;
  transform-origin: center;
  animation: lt-rotating-rings-drift var(--lt-particle-life, 16s) linear both;
}

.lt-rotating-rings__particles .lt-rotating-rings__particle--yellow {
  color: var(--lt-rings-color);
}

.lt-rotating-rings__bg[data-lt-rings-paused] .lt-rotating-rings__ring,
.lt-rotating-rings__bg[data-lt-rings-paused] .lt-rotating-rings__particle {
  animation-play-state: paused;
}

@keyframes lt-rotating-rings-drift {
  0% {
    opacity: 0;
    transform: translate(0, 0);
  }
  7% { opacity: var(--lt-rings-particle-opacity); }
  65% { opacity: calc(var(--lt-rings-particle-opacity) * .7); }
  100% {
    opacity: 0;
    transform: translate(var(--lt-particle-dx), var(--lt-particle-dy));
  }
}

@keyframes lt-rotating-rings-turn {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .lt-rotating-rings__svg .lt-rotating-rings__ring { animation: none; }
  .lt-rotating-rings__bg > .lt-rotating-rings__particles { display: none; }
}
