/* effects.css — переиспользуемые эффекты (единые на все страницы).
   Реестр имён: см. FRONT/EFFECTS.md */

/* Общие токены эффектов — единый источник стиля. */
:root {
  --fx-fill: #9ef605;
  --fx-line: #bac1c8;
  --fx-radius: 16px;
  --fx-timing: 0.65s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Эффект: eff-fill-up — «Заливка снизу» (desktop: hover/open).
   Зелёная плашка растёт снизу вверх и остаётся единой поверхностью открытой карточки. */
.eff-fill-up .c-acc-item {
  position: relative;
  isolation: isolate;
}

.eff-fill-up .c-acc-item::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--fx-fill);
  border-radius: var(--fx-radius);
  transform: scaleY(0);
  transform-origin: bottom;
  opacity: 0;
  transition: transform var(--fx-timing),
              opacity var(--fx-timing);
  pointer-events: none;
}

.eff-fill-up .c-acc-item:not(.is-open):hover::after,
.eff-fill-up .c-acc-item.is-open::after {
  transform: scaleY(1);
  opacity: 1;
}

.eff-fill-up .c-acc-item.no-anim::after {
  transition: none;
}

/* Mobile: без hover и без псевдо-заливки (зелёный фон открытой карточки задаёт styles.css) */
@media (max-width: 1024px) {
  .eff-fill-up .c-acc-item::after {
    transition: none;
  }

  .eff-fill-up .c-acc-item:not(.is-open):hover::after,
  .eff-fill-up .c-acc-item.is-open::after {
    transform: scaleY(0);
    opacity: 0;
  }
}