/* 3DL Rotating Word – FULL CSS (2-line clamp, no clipping, classes aligned with JS) */

/* ============ Container: two lines from first paint ============ */
.tdl-rotate{
  /* Dvě řádky hned od začátku, bez bliknutí na 3 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;          /* nutné pro line-clamp */

  /* Typografická stabilita */
  line-height: 1.25;
  text-wrap: balance;

  /* Rezerva na spodní dotahy a jemné animace */
  padding-bottom: .35em;

  /* Firefox fallback (přibližně 2 řádky při lh ~1.25) */
  max-height: 3.4em;
  position: relative;
}

/* Pokud někde chceš bez clampu, přidej modifier na kontejner */
.tdl-rotate--no-clamp{
  -webkit-line-clamp: unset;
  overflow: visible;
  max-height: none;
  padding-bottom: 0;
}

/* ============ Word-level transitions (fade/slide) ============ */
.tdl-rotate .tdl-word{
  display: inline-block;
  will-change: opacity, transform;
  transition: opacity .22s ease, transform .22s ease;
}

/* Menší posuny, aby nic neřezal overflow */
.tdl-rot-fade-out { opacity: 0; transform: translateY(-.08em); }
.tdl-rot-fade-in  { opacity: 1; transform: translateY(0); }

/* Volitelně decentní underline jen při hoveru */
.tdl-rotate .tdl-word.tdl-hover-underline { text-decoration: none; }
.tdl-rotate .tdl-word.tdl-hover-underline:hover,
.tdl-rotate .tdl-word.tdl-hover-underline a:hover { text-decoration: underline; }

/* ============ Per-character tween (odpovídá TVÉMU JS: .tdl-ch-in) ============ */
.tdl-rotate .tdl-ch{
  display: inline-block;
  opacity: 0;
  transform: translateY(.18em);                 /* zmenšený zdvih (dříve ~.35em) */
  will-change: opacity, transform;
  transition: opacity .20s ease, transform .20s ease;
  white-space: pre;
}
/* JS přidává .tdl-ch-in => znak je viditelný a srovnaný */
.tdl-rotate .tdl-ch.tdl-ch-in{
  opacity: 1;
  transform: translateY(0);
}

/* ============ Odkazy uvnitř rotace ============ */
.tdl-rotate .tdl-link{ color: inherit; text-decoration: inherit; }
.tdl-rotate a{ color: inherit; text-decoration: none; }
.tdl-rotate a:focus{ outline: none; }

/* ============ Přístupnost: reduced motion ============ */
@media (prefers-reduced-motion: reduce){
  .tdl-rotate .tdl-word,
  .tdl-rotate .tdl-ch{
    transition: none !important;
    transform: none !important;
  }
}

/* POZN.: Z původního stylu byly odstraněny konfliktní bloky:
   - .tdl-rotate { visibility:hidden } a [data-ready="1"] přepínač,
   - opakovaně definované .tdl-rotate s !important,
   - "SAFE CLS FIX" s max-height:3.2em, který usekával spodky.
   Viz původní soubor, kde se tyto bloky duplikovaly a tloukly. */
