/* =====================================================================
   Slotnews UI layer — site search, motion, micro-interactions, a11y.
   Loaded after the theme styles; overrides only what it needs to.
   ===================================================================== */

:root {
  --brand-main: #7c3aed;
  --brand-second: #ec4899;
  --ui-surface: #2a2f34;
  --ui-surface-2: #33393f;
  --ui-text: #f5f6fa;
  --ui-muted: #95a5a6;
  --ui-border: rgba(255, 255, 255, 0.08);
  --ui-radius: 12px;
  --ui-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

::selection { background: var(--brand-second); color: #fff; }

/* ---------- Accessibility ---------- */
.skip-link {
  position: absolute; left: 16px; top: -64px; z-index: 100001;
  padding: 10px 16px; border-radius: 8px;
  background: var(--brand-main); color: #fff; font-weight: 700; text-decoration: none;
  transition: top 0.2s var(--ease-out);
}
.skip-link:focus { top: 16px; outline: none; }
:focus-visible { outline: 2px solid var(--brand-second); outline-offset: 3px; }
#main-content:focus { outline: none; }

/* ---------- Page enter ---------- */
.js:not(.reduce-motion) body { animation: ui-page-in 0.5s var(--ease-out) both; }


/* ---------- Header ---------- */
.space-header-wrap { transition: box-shadow 0.3s, background-color 0.3s; }
.space-header-wrap.is-scrolled { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35) !important; }
.space-header-menu ul.main-menu li a { transition: color 0.2s; }

/* Dropdowns: softer entrance + keyboard support */
.space-header-menu ul.main-menu li ul.sub-menu {
  transform: translateY(8px) scale(0.98);
  transform-origin: top left;
  transition: opacity 0.25s var(--ease-out), transform 0.3s var(--ease-out), visibility 0.25s, top 0.3s var(--ease-out);
}
.space-header-menu ul.main-menu li:hover > ul.sub-menu,
.space-header-menu ul.main-menu li.is-focus > ul.sub-menu { transform: none; }
.space-header-menu ul.main-menu > li.is-focus > ul.sub-menu { top: 80px; opacity: 1; visibility: visible; }
.space-header-menu ul.main-menu li ul.sub-menu li a { transition: color 0.2s, transform 0.2s var(--ease-out); }
.space-header-menu ul.main-menu li ul.sub-menu li a:hover { transform: translateX(4px); }

/* ---------- Site search (header + mobile menu) ---------- */
@media (min-width: 1024px) {
  .space-header-menu ul.main-menu { padding-right: 205px; }
}
.space-header .site-search {
  top: 0; bottom: 0; right: 15px; height: auto; margin: 0;
  display: flex; align-items: center;
  font-size: 1em; line-height: normal; color: inherit; cursor: default; z-index: 30;
}
.site-search--mobile { position: relative; }
.space-header .site-search { position: absolute; }
.site-search-form { position: relative; display: flex; align-items: center; margin: 0; }
.site-search input.site-search-input {
  width: 190px; height: 40px; margin: 0; padding: 0 36px 0 40px; float: none;
  border: 1px solid var(--ui-border); border-radius: 999px;
  background: rgba(255, 255, 255, 0.07); color: var(--ui-text);
  font: 400 14px/40px 'Inter', 'Roboto', sans-serif; box-shadow: none; outline: none;
  -webkit-appearance: none; appearance: none;
  transition: width 0.35s var(--ease-out), background-color 0.25s, border-color 0.25s, box-shadow 0.25s;
}
.site-search input.site-search-input { text-overflow: ellipsis; }
.site-search input.site-search-input::placeholder { color: var(--ui-muted); opacity: 1; }
.site-search input.site-search-input::-webkit-search-decoration,
.site-search input.site-search-input::-webkit-search-cancel-button { display: none; }
.site-search.is-focused input.site-search-input,
.site-search input.site-search-input:focus {
  width: 240px;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(185, 65, 154, 0.6);
  box-shadow: 0 0 0 4px rgba(185, 65, 154, 0.18);
}
.site-search-icon {
  position: absolute; left: 15px; top: 50%; transform: translateY(-50%);
  font-size: 14px; color: var(--ui-muted); pointer-events: none; transition: color 0.2s;
}
.site-search.is-focused .site-search-icon { color: var(--brand-second); }
.site-search-clear {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--ui-muted); font-size: 12px; line-height: 28px; cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}
.site-search-clear:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }
.site-search-clear[hidden] { display: none; }

.site-search-results {
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 1000;
  width: 380px; max-width: calc(100vw - 30px); max-height: min(70vh, 520px); overflow: auto;
  padding: 8px; text-align: left;
  background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); box-shadow: var(--ui-shadow);
  opacity: 0; transform: translateY(-8px);
  transition: opacity 0.25s var(--ease-out), transform 0.3s var(--ease-out);
  scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}
.site-search-results::-webkit-scrollbar { width: 8px; }
.site-search-results::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.2); border-radius: 8px; }
.site-search.is-open .site-search-results { opacity: 1; transform: none; }
.site-search-results[hidden] { display: none; }
.site-search-result {
  display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 8px;
  color: var(--ui-text); text-decoration: none; transition: background-color 0.15s;
}
.site-search-result:hover,
.site-search-result.is-active { background: rgba(255, 255, 255, 0.08); color: #fff; }
.site-search-result-thumb {
  flex: 0 0 44px; width: 44px; height: 44px; border-radius: 8px; object-fit: cover;
  display: flex; align-items: center; justify-content: center;
  background: var(--ui-surface-2); color: var(--ui-muted); font-size: 16px;
}
.site-search-result-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.site-search-result-title { font-weight: 700; font-size: 14px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.site-search-result-type { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ui-muted); }
.site-search-result mark,
.search-page-result mark { background: transparent; color: var(--brand-second); font-weight: inherit; }
.site-search-empty { padding: 14px 10px; color: var(--ui-muted); font-size: 14px; }
.site-search-all {
  display: flex; justify-content: center; align-items: center; gap: 8px;
  margin: 6px -8px -8px; padding: 12px; border-top: 1px solid var(--ui-border);
  border-radius: 0 0 var(--ui-radius) var(--ui-radius);
  background: rgba(255, 255, 255, 0.03); color: #fff; font-size: 13px; font-weight: 700; text-decoration: none;
  transition: background-color 0.15s;
}
.site-search-all:hover,
.site-search-all.is-active { background: var(--brand-main); color: #fff; }

.site-search--mobile { padding: 4px 20px 14px; }
.site-search--mobile input.site-search-input,
.site-search--mobile.is-focused input.site-search-input,
.site-search--mobile input.site-search-input:focus { width: 100%; }
.site-search--mobile .site-search-results { left: 20px; right: 20px; width: auto; }
@media (max-width: 1023px) {
  .space-header .site-search { display: none; }
}

/* ---------- Search results page ---------- */
.search-page { max-width: 860px; margin: 0 auto; padding: 10px 0 40px; }
.search-page-form { position: relative; display: flex; align-items: center; margin: 0 0 24px; }
.search-page-form > i { position: absolute; left: 20px; color: var(--ui-muted); pointer-events: none; }
.search-page input.search-page-input {
  flex: 1; width: 100%; height: 56px; margin: 0; padding: 0 130px 0 50px; float: none;
  border: 1px solid var(--ui-border); border-radius: 999px;
  background: rgba(255, 255, 255, 0.06); color: var(--ui-text); font: 400 16px 'Inter', 'Roboto', sans-serif;
  transition: border-color 0.25s, box-shadow 0.25s;
}
.search-page input.search-page-input:focus { outline: none; border-color: rgba(185, 65, 154, 0.6); box-shadow: 0 0 0 4px rgba(185, 65, 154, 0.18); }
.search-page-submit {
  position: absolute; right: 6px; top: 6px; bottom: 6px; padding: 0 24px; border: 0; border-radius: 999px;
  background: linear-gradient(135deg, var(--brand-main), var(--brand-second)); color: #fff;
  font: 700 14px 'Inter', 'Roboto', sans-serif; cursor: pointer; transition: transform 0.2s var(--ease-out), filter 0.2s;
}
.search-page-submit:hover { filter: brightness(1.1); transform: translateY(-1px); }
.search-page-summary { margin: 0 0 20px; color: var(--ui-muted); }
.search-page-summary strong,
.search-page-summary em { color: var(--ui-text); font-style: normal; }
.search-page-results { display: grid; gap: 12px; }
.search-page-result {
  display: flex; align-items: center; gap: 16px; padding: 14px 16px;
  border-radius: var(--ui-radius); border: 1px solid var(--ui-border);
  background: rgba(255, 255, 255, 0.04); color: var(--ui-text); text-decoration: none;
  transition: transform 0.3s var(--ease-out), background-color 0.2s, border-color 0.2s;
}
.search-page-result:hover { transform: translateX(6px); background: rgba(255, 255, 255, 0.07); border-color: rgba(185, 65, 154, 0.4); color: #fff; }
.search-page-result .site-search-result-thumb { flex-basis: 64px; width: 64px; height: 64px; }
.search-page-result-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 4px; }
.search-page-result-type { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--brand-second); }
.search-page-result-title { font-size: 18px; font-weight: 700; line-height: 1.3; }
.search-page-result-text { font-size: 14px; line-height: 1.5; color: var(--ui-muted); }
.search-page-result-arrow { color: var(--ui-muted); transition: transform 0.2s, color 0.2s; }
.search-page-result:hover .search-page-result-arrow { transform: translateX(4px); color: var(--brand-second); }
.search-page-empty { margin-top: 10px; color: var(--ui-muted); }
.search-page-empty[hidden] { display: none; }
.search-page-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.search-page-links a {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.06); color: var(--ui-text); font-weight: 700; text-decoration: none;
  transition: background-color 0.2s, transform 0.2s var(--ease-out);
}
.search-page-links a:hover { background: var(--brand-main); color: #fff; transform: translateY(-2px); }
@media (max-width: 600px) {
  .search-page input.search-page-input { padding-right: 20px; }
  .search-page-submit { position: static; margin-left: 8px; height: 44px; }
  .search-page-result { flex-wrap: wrap; }
}

/* ---------- Scroll reveal ---------- */
.js:not(.reduce-motion) .reveal { opacity: 0; }
.js:not(.reduce-motion) .reveal.is-visible,
.js:not(.reduce-motion).reveal-done .reveal {
  opacity: 1;
  animation: ui-reveal 0.7s var(--ease-out) backwards;
  animation-delay: calc(var(--i, 0) * 55ms);
}

/* ---------- Cards ---------- */
.space-companies-2-archive-item, .space-units-archive-item, .space-offers-archive-item,
.space-organizations-3-archive-item, .space-companies-archive-item, .space-archive-loop-item,
.space-units-3-archive-item, .space-units-2-archive-item, .space-organizations-4-archive-item,
.space-organizations-6-archive-item, .space-organizations-7-archive-item, .space-organizations-8-archive-item,
.space-news-1-item, .space-news-3-item, .space-news-7-item, .space-news-11-item {
  transition: transform 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out);
}
.space-companies-2-archive-item:hover, .space-units-archive-item:hover, .space-offers-archive-item:hover,
.space-organizations-3-archive-item:hover, .space-companies-archive-item:hover, .space-archive-loop-item:hover,
.space-units-3-archive-item:hover, .space-units-2-archive-item:hover, .space-organizations-4-archive-item:hover,
.space-organizations-6-archive-item:hover, .space-organizations-7-archive-item:hover, .space-organizations-8-archive-item:hover,
.space-news-1-item:hover, .space-news-3-item:hover, .space-news-7-item:hover, .space-news-11-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 36px -14px rgba(0, 0, 0, 0.5);
}
[class*="-item-img"] img { transition: filter 0.4s var(--ease-out); }
[class*="-archive-item "]:hover [class*="-item-img"] img,
[class*="-news-"][class*="-item"]:hover [class*="-item-img"] img { filter: brightness(1.08) saturate(1.05); }

/* ---------- Buttons ---------- */
[class*="-item-button"] > a, [class*="-header-button"] > a, [class*="-button-ins"] > a, .block-button__link {
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), filter 0.25s;
}
[class*="-item-button"] > a:hover, [class*="-header-button"] > a:hover, [class*="-button-ins"] > a:hover, .block-button__link:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 10px 24px -8px rgba(111, 20, 201, 0.6);
}
[class*="-item-button"] > a:active, [class*="-header-button"] > a:active, [class*="-button-ins"] > a:active, .block-button__link:active {
  transform: translateY(0) scale(0.98);
}

/* ---------- Hero slider ---------- */
.js:not(.reduce-motion) .space-news-8-items .owl-item.active .space-news-8-item-img img {
  animation: ui-kenburns 16s ease-in-out infinite alternate;
}
.js:not(.reduce-motion) .space-news-8-items .owl-item.active .space-news-8-item-title > .relative {
  animation: ui-reveal 0.8s 0.25s var(--ease-out) backwards;
}
.owl-nav button, .owl-prev, .owl-next { transition: transform 0.2s var(--ease-out), background-color 0.2s, opacity 0.2s; }
.owl-nav button:hover, .owl-prev:hover, .owl-next:hover { transform: scale(1.08); }

/* ---------- Mobile menu ---------- */
.space-mobile-menu { transition: opacity 0.35s var(--ease-out), visibility 0.35s; }
.space-mobile-menu-block { transform: translateX(40px); transition: transform 0.45s var(--ease-out); }
.space-mobile-menu.active .space-mobile-menu-block { transform: none; }
.js:not(.reduce-motion) .space-mobile-menu.active .mobile-menu > li {
  animation: ui-reveal 0.45s var(--ease-out) both;
  animation-delay: calc(120ms + var(--i, 0) * 45ms);
}

/* ---------- Reading progress (single posts) ---------- */
.reading-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 100001; pointer-events: none;
  background: linear-gradient(90deg, var(--brand-main), var(--brand-second));
  transform-origin: 0 50%; transform: scaleX(0);
}

/* ---------- Images ---------- */
.js:not(.reduce-motion) img.img-fade { opacity: 0; transition: opacity 0.5s ease; }
.js img.img-fade.is-loaded,
.js.img-ready img.img-fade { opacity: 1; }

/* ---------- Back to top ---------- */
#scrolltop { transition: opacity 0.3s, visibility 0.3s, bottom 0.3s, transform 0.2s var(--ease-out); }
#scrolltop:hover { transform: translateY(-3px) scale(1.08); }

/* ---------- Keyframes ---------- */
@keyframes ui-page-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes ui-reveal { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes ui-kenburns { from { transform: scale(1); } to { transform: scale(1.08); } }


/* ---------- Title box (posts / archives / search): dark, on-brand ---------- */
.space-title-box,
.space-archive-title-box {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(60% 120% at 85% 0%, rgba(111, 20, 201, 0.35), transparent 60%),
    radial-gradient(40% 90% at 10% 100%, rgba(185, 65, 154, 0.22), transparent 60%),
    linear-gradient(180deg, #24292e 0%, #0c0d12 100%) !important;
  border-bottom: 1px solid var(--ui-border);
}
.space-title-box-h1 h1,
.space-archive-title-box-h1 h1 { color: #fff !important; text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35); }
.space-title-box .space-page-content-excerpt p,
.space-archive-title-box .space-page-content-excerpt p { color: #c9d1d6 !important; }
.space-title-box .space-breadcrumbs,
.space-title-box .space-breadcrumbs a,
.space-archive-title-box .space-breadcrumbs,
.space-archive-title-box .space-breadcrumbs a { color: var(--ui-muted) !important; transition: color 0.2s; }
.space-title-box .space-breadcrumbs a:hover,
.space-archive-title-box .space-breadcrumbs a:hover { color: #fff !important; }
.space-title-box-category-wrap { z-index: 2; }

/* =====================================================================
   Motion layer v2 — navigation, cards, ratings, codes, lightbox
   ===================================================================== */

.space-header-menu ul.main-menu > li.best > a:before,
.space-header-menu ul.main-menu > li.top > a:before,
.space-header-menu ul.main-menu > li.hot > a:before,
.space-header-menu ul.main-menu > li.new > a:before {
  animation: ui-label-pulse 2.8s ease-in-out infinite;
}
.space-header-menu ul.main-menu li ul.sub-menu li a { padding-right: 18px; }

/* ---------- Filters & pagination ---------- */
.space-categories-title li,
.space-categories-title li a { transition: transform 0.25s var(--ease-out), background-color 0.25s, color 0.25s, box-shadow 0.25s; }
.space-categories-title li:hover { transform: translateY(-2px); box-shadow: 0 8px 20px -8px rgba(185, 65, 154, 0.7); }
.page-numbers { transition: transform 0.2s var(--ease-out), background-color 0.2s, color 0.2s, box-shadow 0.2s; }
a.page-numbers:hover { transform: translateY(-2px); box-shadow: 0 8px 18px -8px rgba(111, 20, 201, 0.8); }

/* ---------- Cards: image zoom + accent ---------- */
[class*="-archive-item-img"]:not([class*="-ins"]),
.space-news-1-item-img, .space-news-3-item-img, .space-news-7-item-img, .space-news-11-item-img,
.space-companies-2-archive-item-img, .space-companies-archive-item-img { overflow: hidden; }
[class*="-archive-item-img"] img,
[class*="-news-"][class*="-item-img"]:not(.space-news-8-item-img) img,
.space-companies-2-archive-item-img img,
.space-companies-archive-item-img img { transition: transform 0.7s var(--ease-out), filter 0.4s var(--ease-out); }
[class*="-archive-item "]:hover [class*="-archive-item-img"] img,
.space-news-1-item:hover .space-news-1-item-img img,
.space-news-3-item:hover .space-news-3-item-img img,
.space-news-7-item:hover .space-news-7-item-img img,
.space-news-11-item:hover .space-news-11-item-img img { transform: scale(1.06); }
.space-units-archive-item:hover, .space-offers-archive-item:hover, .space-organizations-3-archive-item:hover,
.space-units-3-archive-item:hover, .space-units-2-archive-item:hover, .space-organizations-4-archive-item:hover,
.space-organizations-6-archive-item:hover, .space-organizations-7-archive-item:hover, .space-organizations-8-archive-item:hover,
.space-news-1-item:hover, .space-news-3-item:hover, .space-news-7-item:hover, .space-news-11-item:hover {
  box-shadow: 0 18px 36px -14px rgba(0, 0, 0, 0.5);
}
[class*="-archive-item-title"] a, [class*="-item-title"] a { transition: color 0.2s; }

/* ---------- Sidebar widgets ---------- */
.space-block-title { position: relative; }
.space-block-title span { display: inline-block; }
.js:not(.reduce-motion) .space-block-title.is-visible span { animation: ui-slide-in 0.6s var(--ease-out) both; }
.space-companies-sidebar-item, .space-units-sidebar-item { transition: transform 0.3s var(--ease-out); }
.space-companies-sidebar-item:hover, .space-units-sidebar-item:hover { transform: translateX(4px); }

/* ---------- Ratings ---------- */
.js:not(.reduce-motion) .is-visible [class*="-rating"] i,
.js:not(.reduce-motion) .is-visible [class*="-stars"] i { animation: ui-star-pop 0.5s var(--ease-out) both; }
.is-visible [class*="-rating"] i:nth-child(1), .is-visible [class*="-stars"] i:nth-child(1) { animation-delay: 0.15s; }
.is-visible [class*="-rating"] i:nth-child(2), .is-visible [class*="-stars"] i:nth-child(2) { animation-delay: 0.25s; }
.is-visible [class*="-rating"] i:nth-child(3), .is-visible [class*="-stars"] i:nth-child(3) { animation-delay: 0.35s; }
.is-visible [class*="-rating"] i:nth-child(4), .is-visible [class*="-stars"] i:nth-child(4) { animation-delay: 0.45s; }
.is-visible [class*="-rating"] i:nth-child(5), .is-visible [class*="-stars"] i:nth-child(5) { animation-delay: 0.55s; }
[class*="-rating"] i { display: inline-block; }
.ui-counted { font-variant-numeric: tabular-nums; }

/* ---------- Buttons: sheen + CTA glow ---------- */
[class*="-item-button"] > a, [class*="-header-button"] > a, [class*="-button-ins"] > a, .block-button__link, .search-page-submit {
  background-image: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, 0.22) 50%, transparent 65%);
  background-size: 260% 100%;
  background-position: 120% 0;
  background-repeat: no-repeat;
  transition: transform 0.25s var(--ease-out), box-shadow 0.25s var(--ease-out), filter 0.25s, background-position 0.7s var(--ease-out);
}
[class*="-item-button"] > a:hover, [class*="-header-button"] > a:hover, [class*="-button-ins"] > a:hover, .block-button__link:hover, .search-page-submit:hover {
  background-position: -20% 0;
}
.js:not(.reduce-motion) [class*="-header-button"] > a { animation: ui-glow 3.2s ease-in-out infinite; }

/* ---------- Bonus codes: click to copy ---------- */
.space-offers-archive-item-code,
.space-aces-single-offer-info-code-ins { cursor: pointer; transition: transform 0.25s var(--ease-out), box-shadow 0.25s, border-color 0.25s; }
.space-offers-archive-item-code:hover,
.space-aces-single-offer-info-code-ins:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(185, 65, 154, 0.7); }
.ui-copy { position: relative; }
.ui-copy::after {
  content: attr(data-copy-label);
  position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 6px);
  padding: 6px 10px; border-radius: 6px; white-space: nowrap; pointer-events: none;
  background: var(--brand-main); color: #fff; font-size: 12px; font-weight: 700; line-height: 1;
  opacity: 0; transition: opacity 0.2s, transform 0.25s var(--ease-out); z-index: 5;
}
.ui-copy:hover::after, .ui-copy.is-copied::after { opacity: 1; transform: translate(-50%, 0); }
.ui-copy.is-copied::after { background: #2edd6c; color: #0f2b1a; }
.ui-copy.is-copied [class*="-code-value"] { animation: ui-star-pop 0.4s var(--ease-out); }

/* ---------- Pros / cons ---------- */
.space-pros-description li, .space-cons-description li { transition: transform 0.25s var(--ease-out); }
.space-pros-description li:hover, .space-cons-description li:hover { transform: translateX(4px); }

/* ---------- Owl carousel dots ---------- */
.owl-dots .owl-dot span { transition: width 0.3s var(--ease-out), background-color 0.3s, opacity 0.3s; }
.owl-dots .owl-dot.active span { width: 24px; background: var(--brand-second); }

/* ---------- Footer ---------- */
.space-footer a { transition: color 0.2s, transform 0.2s var(--ease-out); }
.space-footer-menu li a:hover { color: #fff; }
.space-footer-area ul li a { display: inline-block; }
.space-footer-area ul li a:hover { transform: translateX(4px); }

/* ---------- Page transitions ---------- */
.js:not(.reduce-motion) body.is-leaving { animation: ui-page-out 0.22s ease-in both; }

/* ---------- Lightbox ---------- */
.block-image img, .space-page-content figure img, .space-organization-content img { cursor: zoom-in; }
.ui-lightbox {
  position: fixed; inset: 0; z-index: 100002; display: flex; align-items: center; justify-content: center;
  padding: 4vw; background: rgba(12, 14, 16, 0.92); backdrop-filter: blur(6px); cursor: zoom-out;
  opacity: 0; transition: opacity 0.25s ease;
}
.ui-lightbox.is-open { opacity: 1; }
.ui-lightbox img {
  max-width: 100%; max-height: 100%; border-radius: 12px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
  transform: scale(0.92); transition: transform 0.35s var(--ease-out);
}
.ui-lightbox.is-open img { transform: none; }
.ui-lightbox-close {
  position: absolute; top: 18px; right: 22px; width: 44px; height: 44px; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, 0.1); color: #fff; font-size: 18px; cursor: pointer; transition: background-color 0.2s, transform 0.2s;
}
.ui-lightbox-close:hover { background: var(--brand-main); transform: rotate(90deg); }
.ui-lightbox-caption { position: absolute; left: 0; right: 0; bottom: 20px; text-align: center; color: var(--ui-muted); font-size: 14px; padding: 0 20px; }

/* ---------- Keyframes v2 ---------- */
@keyframes ui-label-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
@keyframes ui-star-pop { 0% { transform: scale(0.3); opacity: 0; } 60% { transform: scale(1.2); opacity: 1; } 100% { transform: scale(1); opacity: 1; } }
@keyframes ui-slide-in { from { opacity: 0; transform: translateX(-16px); } to { opacity: 1; transform: none; } }
@keyframes ui-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(111, 20, 201, 0.55); } 50% { box-shadow: 0 0 0 10px rgba(111, 20, 201, 0); } }
@keyframes ui-page-out { to { opacity: 0; } }

