.cc_ygsyvcoo_9ZzIY88vrW .hira-kg {
  padding-top: var(--kg-pt, 32px);
  padding-bottom: var(--kg-pb, 32px);
  color: var(--color-text);
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-bottom: clamp(24px, 3.5vw, 44px);
  text-align: center;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg--left .hira-kg__head {
  align-items: flex-start;
  text-align: left;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg--right .hira-kg__head {
  align-items: flex-end;
  text-align: right;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__eyebrow {
  margin: 0 0 12px;
  font: 800 12px var(--font-heading);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent-700);
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: var(--kg-title-size, clamp(30px, 4.4vw, 60px));
  line-height: 0.98;
  letter-spacing: -0.04em;
  color: var(--kg-title-color, inherit);
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__desc {
  max-width: 520px;
  margin: 14px auto 0;
  font-size: var(--kg-desc-size, inherit);
  color: var(--kg-desc-color, var(--color-neutral-700));
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg--left .hira-kg__desc {
  margin-left: 0;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg--right .hira-kg__desc {
  margin-right: 0;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__all {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 4px;
  border-bottom: 2px solid currentColor;
  font: 800 15px var(--font-heading);
  color: var(--color-text);
  text-decoration: none;
  transition: gap 0.3s ease, color 0.3s ease;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__all:hover {
  gap: 16px;
  color: var(--color-accent-700);
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__grid {
  display: grid;
  grid-template-columns: repeat(var(--kg-cols, 4), minmax(0, 1fr));
  gap: var(--kg-gap, 20px);
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__cell {
  min-width: 0;
  aspect-ratio: var(--kg-ratio, 1 / 1);
  transition: opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1) var(--d, 0ms), transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) var(--d, 0ms);
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg.is-ready:not(.is-in) .hira-kg__cell {
  opacity: 0;
  transform: translateY(32px);
}

/* Each tile wears an overlay. Every 2.4s a wave runs left to right: the overlays lift away one column after
   the next, come straight back. Starts once the tiles have faded in. */
.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__cell {
  position: relative;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__cell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 5;
  background: var(--kg-overlay, rgba(10, 14, 18, 0.45));
  pointer-events: none;
  transition: opacity 0.35s ease;
}

/* Hovering (or keyboard-focusing) a tile lifts its overlay off, so the picture shows clean. The wave
   animation keeps running underneath (an !important value beats the animated one) — stopping it would
   restart that tile's timeline on mouse-out and knock it out of the left-to-right order. */
.cc_ygsyvcoo_9ZzIY88vrW .hira-kg__cell:hover::after, .cc_ygsyvcoo_9ZzIY88vrW .hira-kg__cell:focus-within::after {
  opacity: 0 !important;
}

.cc_ygsyvcoo_9ZzIY88vrW .hira-kg.is-in .hira-kg__cell::after {
  animation: cc_ygsyvcoo_9ZzIY88vrW_hiraKgWave 2.4s ease-in-out calc(1.2s + var(--wave, 0) * 0.3s) infinite;
}

/* Each tile lifts for ~1s; with the column stagger the last tile is back ~0.5s before the next wave. */
@keyframes cc_ygsyvcoo_9ZzIY88vrW_hiraKgWave {
  0% { opacity: 1; }
  20% { opacity: 0; }
  40%, 100% { opacity: 1; }
}

@media (max-width: 900px) {
  .cc_ygsyvcoo_9ZzIY88vrW .hira-kg.is-in .hira-kg__cell::after {
    animation-delay: calc(1.2s + var(--wave-m, 0) * 0.22s);
  }
  .cc_ygsyvcoo_9ZzIY88vrW .hira-kg__grid {
    grid-template-columns: repeat(var(--kg-cols-m, 2), minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_ygsyvcoo_9ZzIY88vrW .hira-kg.is-in .hira-kg__cell::after {
    animation: none;
  }
  .cc_ygsyvcoo_9ZzIY88vrW .hira-kg__cell {
    transition: none;
  }
  .cc_ygsyvcoo_9ZzIY88vrW .hira-kg.is-ready:not(.is-in) .hira-kg__cell {
    opacity: 1;
    transform: none;
  }
}