/* ============================================================
   UAITP — Emil-style polish layer (loaded last, overrides webflow)
   Принципи: точні властивості в transition, сильні кастомні криві,
   press-feedback, hover лише на пристроях з курсором, reduced-motion.
   ============================================================ */

:root {
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);       /* сильний ease-out для входу/відгуку */
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);   /* для руху на екрані */
  --dur-press: 140ms;
  --dur-hover: 200ms;
}

/* ---- Картинка в картці новини (листинг) ---- */
.pub-news-container .image-15 {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 9px;
}

/* ---- Сторінка новини: акуратний вигляд імпортованого Joomla-контенту ---- */
/* Картинки масштабуються, але дрібні іконки (width=20) лишаються дрібними інлайн */
/* Контентні картинки статті — НЕ чіпаємо галерею (.thumb-img / .gallery-active-image) */
.publication-text-wrapper img:not(.thumb-img):not(.gallery-active-image) {
  max-width: 100%;
  height: auto;
  float: none;
  vertical-align: middle;
}
/* Великі фото статті — на всю ширину контенту, по центру */
.publication-text-wrapper .article-photo {
  display: block;
  width: 100%;
  max-width: 760px;
  margin: 24px auto;
  border-radius: 9px;
}
/* Дрібні іконки/емодзі лишаються маленькими інлайн */
.publication-text-wrapper .emoji-small {
  display: inline;
  width: auto;
}
.publication-text-wrapper [style] { font-size: inherit !important; line-height: inherit !important; }
.publication-text-wrapper p { margin: 0 0 14px; }
.publication-text-wrapper h2,
.publication-text-wrapper h3 { margin: 24px 0 12px; }
/* Joomla часто загортав звичайний текст у h4/h5 — приводимо до читабельного вигляду */
.publication-text-wrapper h4,
.publication-text-wrapper h5 {
  font-size: 1.05rem;
  font-weight: 400;
  line-height: 1.6;
  margin: 0 0 14px;
}
.publication-text-wrapper a { color: var(--uaitp-dark-blue); text-decoration: underline; }
.publication-text-wrapper table { max-width: 100%; display: block; overflow-x: auto; }

/* ---- Плавні кольорові hover-и (були миттєві) ---- */
.button-test,
.button-test-blue,
.button-cta-blue,
.button-check,
.button-language,
.check-button,
.statut-holder,
.form-holder,
.partner-item,
.link,
.link-2,
.link-regular,
.footer-nav-item,
.dropdown-item {
  transition: background-color var(--dur-hover) var(--ease-out),
              color var(--dur-hover) var(--ease-out),
              border-color var(--dur-hover) var(--ease-out),
              transform var(--dur-press) var(--ease-out),
              box-shadow var(--dur-hover) var(--ease-out);
}

/* ---- Press-feedback: кнопка «чує» натискання ---- */
.button-test:active,
.button-test-blue:active,
.button-cta-blue:active,
.button-check:active,
.button-language:active,
.check-button:active {
  transform: scale(0.97);
}

/* ---- Hover-lift клікабельних карток (тільки за наявності курсора) ---- */
@media (hover: hover) and (pointer: fine) {
  .partner-item,
  .video-grid-item,
  .statut-holder,
  .form-holder,
  .program-container,
  .pub-news-container {
    transition: transform var(--dur-hover) var(--ease-out),
                box-shadow var(--dur-hover) var(--ease-out),
                background-color var(--dur-hover) var(--ease-out);
    will-change: transform;
  }
  .partner-item:hover,
  .video-grid-item:hover,
  .statut-holder:hover,
  .form-holder:hover,
  .program-container:hover,
  .pub-news-container:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px -12px rgba(16, 36, 60, 0.18);
  }
  .program-container:active,
  .video-grid-item:active,
  .partner-item:active,
  .pub-news-container:active {
    transform: translateY(-1px) scale(0.995);
  }

  /* Легкий зум обкладинки відео/зображення програми при hover картки */
  .video-grid-item .video-cover-image-preview,
  .program-container .program-image {
    transition: transform 300ms var(--ease-out);
    will-change: transform;
  }
  .video-grid-item:hover .video-cover-image-preview,
  .program-container:hover .program-image {
    transform: scale(1.03);
  }
}

/* ---- Активна сторінка в навігації ---- */
.dropdown-item.is-current,
.footer-nav-item.is-current {
  color: var(--uaitp-dark-blue);
  font-weight: 700;
}

/* ---- Доступність: видимий фокус лише з клавіатури ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.button-test:focus-visible,
.button-cta-blue:focus-visible,
.button-check:focus-visible,
.partner-item:focus-visible,
.video-grid-item:focus-visible,
.program-container:focus-visible,
.pub-news-container:focus-visible,
.statut-holder:focus-visible,
.form-holder:focus-visible {
  outline: 2px solid var(--uaitp-dark-blue);
  outline-offset: 3px;
  border-radius: 4px;
}
*:focus:not(:focus-visible) {
  outline: none;
}

/* ---- Поля форм: плавний, чіткіший фокус ---- */
.text-field,
.select-field {
  transition: border-color var(--dur-hover) var(--ease-out),
              box-shadow var(--dur-hover) var(--ease-out);
}
.text-field:focus,
.select-field:focus {
  border-bottom-color: var(--uaitp-dark-blue);
  box-shadow: 0 1px 0 0 var(--uaitp-dark-blue);
}

/* ---- Поява карток у сітках із каскадом (flash-free: гейт через .js-anim на <html>) ---- */
.js-anim .people-grid > *,
.js-anim .partners-grid > *,
.js-anim .videos-grid > *,
.js-anim .grid-container-centers > *,
.js-anim .news-grid > *,
.js-anim .all-programs > *,
.js-anim .horizontal-grid > * {
  opacity: 0;
  transform: translateY(12px);
}
.js-anim .people-grid > *.is-in,
.js-anim .partners-grid > *.is-in,
.js-anim .videos-grid > *.is-in,
.js-anim .grid-container-centers > *.is-in,
.js-anim .news-grid > *.is-in,
.js-anim .all-programs > *.is-in,
.js-anim .horizontal-grid > *.is-in {
  opacity: 1;
  transform: none;
  transition: opacity 480ms var(--ease-out), transform 480ms var(--ease-out);
}

/* ---- Повага до prefers-reduced-motion: прибираємо рух, лишаємо кольори ---- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .partner-item:hover,
  .video-grid-item:hover,
  .statut-holder:hover,
  .form-holder:hover,
  .program-container:hover,
  .pub-news-container:hover,
  .video-grid-item:hover .video-cover-image-preview,
  .program-container:hover .program-image {
    transform: none;
  }
}

/* ---- Слайдер галереї у статтях ---- */
.gallery-active-image { width: 100%; border-radius: 9px; object-fit: cover; }
.gallery-container .thumb-img {
  cursor: pointer;
  opacity: 0.55;
  border-radius: 6px;
  transition: opacity 160ms var(--ease-out), transform 160ms var(--ease-out);
}
.gallery-container .thumb-img.active,
.gallery-container .thumb-img:hover { opacity: 1; }
.gallery-container .gallery-left-button,
.gallery-container .gallery-right-button { cursor: pointer; }
.gallery-container .gallery-left-button.inactive,
.gallery-container .gallery-right-button.inactive { opacity: 0.3; pointer-events: none; }
.thumbnail-carousel { overflow-x: auto; scrollbar-width: thin; }

/* ---- Лайтбокс (попап) для картинок ---- */
.uaitp-lightbox {
  position: fixed; inset: 0; z-index: 9999;
  display: none; align-items: center; justify-content: center;
  background: rgba(10, 18, 30, 0.92);
  opacity: 0; transition: opacity 200ms var(--ease-out);
}
.uaitp-lightbox.open { display: flex; opacity: 1; }
.uaitp-lightbox .lb-img {
  max-width: 90vw; max-height: 88vh; object-fit: contain;
  border-radius: 8px; box-shadow: 0 24px 70px rgba(0,0,0,0.55);
  transform: scale(0.96); transition: transform 220ms var(--ease-out);
}
.uaitp-lightbox.open .lb-img { transform: scale(1); }
.uaitp-lightbox button {
  position: absolute; border: none; cursor: pointer; color: #fff;
  background: rgba(255,255,255,0.12); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: background 160ms var(--ease-out), transform 140ms var(--ease-out);
}
.uaitp-lightbox button:hover { background: rgba(255,255,255,0.22); }
.uaitp-lightbox button:active { transform: scale(0.94); }
.uaitp-lightbox .lb-close { top: 20px; right: 20px; width: 46px; height: 46px; font-size: 28px; }
.uaitp-lightbox .lb-prev, .uaitp-lightbox .lb-next {
  top: 50%; transform: translateY(-50%); width: 54px; height: 54px; font-size: 32px;
}
.uaitp-lightbox .lb-prev { left: 24px; }
.uaitp-lightbox .lb-next { right: 24px; }
.uaitp-lightbox .lb-prev:active, .uaitp-lightbox .lb-next:active { transform: translateY(-50%) scale(0.94); }
@media (max-width: 600px) {
  .uaitp-lightbox .lb-prev, .uaitp-lightbox .lb-next { width: 42px; height: 42px; font-size: 26px; }
  .uaitp-lightbox .lb-close { width: 40px; height: 40px; }
}

/* ---- Підвал: вирівнювання колонок (заголовки 1 та 2 рядки) ---- */
.footer-nav-column-title { min-height: 2.4em; }
