/* Rich SVG icons – layered (bg / core / accent / glare), hover parallax + idle pulse */
.kicon {
  --k-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --k-glow: rgba(242, 179, 61, .85);
  display: block;
  overflow: visible;
}

.kicon .svg-bg,
.kicon .svg-core,
.kicon .svg-accent,
.kicon .svg-glare {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .4s var(--k-ease), opacity .4s var(--k-ease), filter .4s var(--k-ease);
}

/* Idle "alive" loop: ~1.5s of motion inside a long cycle; each icon sets its own --k-cycle / --k-delay */
.kicon .svg-core {
  animation: kicon-core var(--k-cycle, 12s) var(--k-ease) var(--k-delay, 0s) infinite;
}
.kicon .svg-accent {
  animation: kicon-accent var(--k-cycle, 12s) var(--k-ease) var(--k-delay, 0s) infinite;
}

@keyframes kicon-core {
  0%, 88% { transform: none; }
  91.5%   { transform: translateY(-2px); }
  95%, 100% { transform: none; }
}
@keyframes kicon-accent {
  0%, 88.5% { transform: none; }
  92.5%     { transform: translateY(-3px) scale(1.06); }
  96%, 100% { transform: none; }
}

/* Hover / focus on the parent: layers move independently */
.kicon-host:hover .kicon .svg-core,
.kicon-host:hover .kicon .svg-accent,
.kicon-host:focus-visible .kicon .svg-core,
.kicon-host:focus-visible .kicon .svg-accent { animation: none; }

.kicon-host:hover .kicon .svg-bg,
.kicon-host:focus-visible .kicon .svg-bg { transform: scale(.95); }

.kicon-host:hover .kicon .svg-core,
.kicon-host:focus-visible .kicon .svg-core { transform: translateY(-3px); }

.kicon-host:hover .kicon .svg-accent,
.kicon-host:focus-visible .kicon .svg-accent {
  transform: translateY(-4.5px) scale(1.06);
  filter: drop-shadow(0 0 2.5px var(--k-glow));
}

.kicon-host:hover .kicon .svg-glare,
.kicon-host:focus-visible .kicon .svg-glare { transform: translate(1.5px, 1px); opacity: .6; }

@media (prefers-reduced-motion: reduce) {
  .kicon .svg-core,
  .kicon .svg-accent { animation: none !important; }
  .kicon .svg-bg,
  .kicon .svg-core,
  .kicon .svg-accent,
  .kicon .svg-glare { transition: none !important; transform: none !important; }
}
