/* ===== Ефекти поверх оригінальної теми. Видаліть підключення цього файлу і effects.js — сайт стане як був. ===== */

/* Поки effects.js не перебудував фігури — ховаємо їх, щоб не було блимання */
.fx .hero__body > img,
.fx .hero__title,
.fx .hero__decor,
.fx .body-section__decor img,
.fx .footer-contacts__image img { visibility: hidden; }

/* Побудова емблеми */
.fx-emblem { position: relative; display: inline-block; flex: 0 0 auto; line-height: 0; }
.fx-emblem > img { display: block; }
.fx-emblem__draft { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }

/* Inline-SVG декору поводиться як картинка */
svg.ibg { display: block; }
svg.hero__decor { display: block; }

/* Активний пункт меню — тонка смужка знизу */
.menu__link.is-active::before { height: .1875rem; }
@media (any-hover: hover) { .menu__link.is-active:hover::before { height: 100%; } }

/* Картки років */
.item-chrono { transition: transform .3s ease; }
.item-chrono__title { position: relative; }
.item-chrono__title::after {
  content: ""; position: absolute; left: 0; bottom: -.375rem;
  width: 0; height: .125rem; background: #b8001f; transition: width .3s ease;
}
@media (any-hover: hover) {
  .item-chrono:hover { transform: translateY(-.25rem); }
  .item-chrono:hover .item-chrono__title::after { width: 2.5rem; }
}

/* Кнопка «вгору» */
.to-top {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 50;
  width: 3rem; height: 3rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: #3a3ba9; border: .0625rem solid #3a3ba9; cursor: pointer;
  box-shadow: 0 .25rem 1rem rgba(58, 59, 169, .15);
  opacity: 0; visibility: hidden; transform: translateY(.75rem);
  transition: opacity .3s, visibility .3s, transform .3s, background-color .3s, color .3s;
}
.to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.to-top svg { width: 1.25rem; height: 1.25rem; }
.to-top:focus-visible { outline: .125rem solid #b8001f; outline-offset: .1875rem; }
@media (any-hover: hover) { .to-top:hover { background: #3a3ba9; color: #fff; } }
@media (max-width: 47.99875em) { .to-top { right: .9375rem; bottom: .9375rem; width: 2.75rem; height: 2.75rem; } }
@media (prefers-reduced-motion: reduce) { .item-chrono, .to-top { transition: none; } }