/* =====================================================================
   [ts-partneri] slider log a [ts-loga] logolinka pořadatelů.
   Vše pod .tspa / .tspa-logos, reset proti stylům šablony (Salient).
   ===================================================================== */
@font-face { font-family: "TSL Azeret"; src: url("fonts/Azeret-Regular.woff2") format("woff2"); font-weight: 400 500; font-display: swap; }
@font-face { font-family: "TSL Azeret"; src: url("fonts/Azeret-Bold.woff") format("woff"); font-weight: 600 700; font-display: swap; }

.tspa, .tspa-logos {
  --tspa-max-w: 140px;
  --tspa-max-h: 64px;
  font-family: "Azeret", "TSL Azeret", system-ui, sans-serif;
  color: #111;
  -webkit-font-smoothing: antialiased;
}
.tspa *, .tspa *::before, .tspa *::after, .tspa-logos * { box-sizing: border-box; }
.tspa button { margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; line-height: 1; text-transform: none; box-shadow: none; cursor: pointer; -webkit-appearance: none; appearance: none; }
.tspa.tspa h2 { margin: 0; padding: 0; color: inherit; font-family: inherit; letter-spacing: normal; text-transform: none; }
.tspa p { margin: 0; padding: 0; color: inherit; font-family: inherit; letter-spacing: normal; text-transform: none; }
.tspa span { color: inherit; }
.tspa a, .tspa-logos a { color: inherit; text-decoration: none; box-shadow: none; border: 0; }
.tspa a:focus-visible, .tspa button:focus-visible, .tspa-logos a:focus-visible, .tspa .tspa-track:focus-visible { outline: 2px solid #111; outline-offset: 3px; }
.tspa img, .tspa-logos img { margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; }

/* Sekce na homepage */
.tspa { display: block; padding: 12px 0; text-align: left; }
.tspa .tspa-panel {
  max-width: 1520px; margin: 0 auto;
  --tspa-pad: clamp(20px, 4vw, 56px);
  display: flex; flex-direction: column; gap: 32px;
  padding: clamp(36px, 6vw, 88px) var(--tspa-pad);
  background: #fff; border-radius: 14px;
}
.tspa .tspa-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; }
.tspa .tspa-head__text { display: flex; flex-direction: column; gap: 14px; }
.tspa .tspa-title.tspa-title { font-size: clamp(36px, 4.6vw, 64px); font-weight: 700; line-height: .98; letter-spacing: -0.04em; }
.tspa .tspa-perex.tspa-perex { font-size: 18px; line-height: 1.4; color: #333; }
.tspa .tspa-arrows { display: flex; gap: 8px; }
.tspa .tspa-arrows.is-hidden { visibility: hidden; }
.tspa .tspa-arrow {
  width: 52px; height: 52px; border-radius: 50% !important;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  transition: background-color .15s ease, color .15s ease, opacity .15s ease;
}
.tspa .tspa-arrow--prev { background: #efefef; color: #111; }
.tspa .tspa-arrow--prev:hover { background: #111; color: #fff; }
.tspa .tspa-arrow--next { background: #111; color: #fff; }
.tspa .tspa-arrow--next:hover { background: #ee263e; color: #111; }
.tspa .tspa-arrow:disabled { opacity: .35; cursor: default; }
.tspa .tspa-arrow--prev:disabled:hover { background: #efefef; color: #111; }
.tspa .tspa-arrow--next:disabled:hover { background: #111; color: #fff; }

/* Slider vpravo až k okraji bílého panelu (loga „přetékají“), na konci odsazení jako panel. */
.tspa .tspa-track {
  margin-right: calc(-1 * var(--tspa-pad));
  padding-right: var(--tspa-pad);
  display: flex; gap: 8px;
  overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x proximity;
  scrollbar-width: none; padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
}
.tspa .tspa-track::-webkit-scrollbar { display: none; }
.tspa .tspa-tile {
  flex: 0 0 200px; height: 110px; padding: 14px;
  display: flex; align-items: center; justify-content: center; text-align: center;
  background: #fff; border: 1px solid #e3e3e3; border-radius: 12px;
  scroll-snap-align: start;
  transition: border-color .15s ease;
}
.tspa a.tspa-tile:hover { border-color: #f2f2f2; }
/* Logo vždy na střed dlaždice (i SVG bez rozměrů). Selektory jsou silnější než
   „.row .col img { margin-bottom: 15px; max-width: 100% }“ ze šablony Salient. */
.tspa .tspa-tile .tspa-tile__img { display: block; margin: 0; padding: 0; object-position: center center; flex: 0 0 auto; width: auto; height: auto; max-width: min(var(--tspa-max-w), 100%); max-height: var(--tspa-max-h); object-fit: contain; }
/* Ručně nastavená šířka loga (u obrázku v knihovně médií) */
/* Ručně nastavená šířka loga (u obrázku v knihovně médií): dlaždice se rozšíří podle loga. */
.tspa .tspa-tile:has(.is-custom) { flex-basis: auto; min-width: 200px; }
.tspa .tspa-tile .tspa-tile__img.is-svg { width: min(var(--tspa-max-w), 100%); }
.tspa .tspa-tile .tspa-tile__img.is-custom { max-width: none; max-height: 82px; height: auto; }

.tspa .tspa-all {
  align-self: flex-start; display: flex; align-items: center; gap: 12px;
  padding: 12px 12px 12px 22px; border-radius: 999px;
  background: #efefef; color: #111; font-size: 16px; font-weight: 700; line-height: 1.2;
  transition: background-color .15s ease, color .15s ease;
}
.tspa .tspa-all:hover { background: #111; color: #fff; }
.tspa .tspa-all__arrow { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #ee263e; color: #111; font-size: 14px; }

/* Logolinka na stránce partnerů */
.tspa-logos {
  --tspa-gap: 40px 56px;
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: var(--tspa-gap);
  padding: 8px 0;
}
.tspa-logos .tspa-logo { display: flex; align-items: center; justify-content: center; transition: opacity .15s ease; }
.tspa-logos a.tspa-logo:hover { opacity: .7; }
.tspa-logos .tspa-logo .tspa-logo__img { display: block; margin: 0; padding: 0; object-position: center center; width: auto; height: auto; max-width: var(--tspa-max-w); max-height: var(--tspa-max-h); object-fit: contain; }
/* SVG často nemá vlastní rozměry (jen viewBox) – šířku dáme výslovně, výška se dopočítá. */
.tspa-logos .tspa-logo .tspa-logo__img.is-svg { width: var(--tspa-max-w); }
.tspa-logos .tspa-logo .tspa-logo__img.is-custom { max-width: 100%; max-height: none; }

@media (max-width: 600px) {
  .tspa .tspa-tile { flex-basis: 160px; height: 96px; }
  .tspa-logos { --tspa-gap: 28px 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .tspa .tspa-track { scroll-behavior: auto; }
}

/* =====================================================================
   [ts-online-loga] – loga v černé sekci „Zapojte se odkudkoli“.
   Počítač: loga vedle sebe (každé ve své šířce), menší displeje: nekonečný carousel.
   ===================================================================== */
.tson {
  --tson-op: .6; --tson-dur: 20s; --tson-max-w: 110px; --tson-max-h: 32px; --tson-gap: 48px;
  display: block; width: 100%; overflow: hidden;
}
.tson * { box-sizing: border-box; }
.tson .tson-track { display: flex; flex-wrap: wrap; align-items: center; gap: 24px var(--tson-gap); }
.tson .tson-item {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none;
  color: inherit; text-decoration: none;
}
.tson a.tson-item:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.tson .tson-item--dup { display: none; }
/* Silnější selektor než „.row .col img { margin-bottom: 15px; max-width: 100% }“ ze šablony Salient. */
.tson .tson-item .tson-img {
  display: block; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none;
  width: auto; height: auto; max-width: var(--tson-max-w); max-height: var(--tson-max-h);
  object-fit: contain; object-position: center;
  opacity: var(--tson-op);
  transition: opacity .15s ease;
}
/* SVG bez vlastních rozměrů: výška podle max. výšky, šířka z poměru stran (každé logo jen tak široké, jak potřebuje).
   Ručně nastavená šířka (u obrázku) má přednost. */
.tson .tson-item .tson-img.is-svg { width: auto; height: var(--tson-max-h); }
.tson .tson-item .tson-img.is-custom { height: auto; max-width: none; max-height: none; }
.tson.tson--white .tson-item .tson-img { filter: brightness(0) invert(1); }
.tson a.tson-item:hover .tson-img { opacity: 1; }

@media (max-width: 899px) {
  .tson { -webkit-mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent); mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent); }
  /* Dvě kopie log za sebou, posun o polovinu = plynulá smyčka. Padding = mezera, aby -50 % sedělo přesně. */
  .tson .tson-track { flex-wrap: nowrap; gap: var(--tson-gap); width: max-content; padding-right: var(--tson-gap); animation: tson-marquee var(--tson-dur) linear infinite; }
  .tson .tson-item--dup { display: flex; }
  .tson:hover .tson-track, .tson:focus-within .tson-track { animation-play-state: paused; }
}
@keyframes tson-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 899px) and (prefers-reduced-motion: reduce) {
  .tson { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .tson .tson-track { animation: none; }
  .tson .tson-item--dup { display: none; }
}