/* Figuras do time (Identidade Locomotiva). As cores e o tamanho do nome vêm do painel (CSS em linha). */
.lii-time-figuras .lii-tf-on { position: relative; overflow: hidden; background: transparent !important; container-type: inline-size; }
.lii-time-figuras .lii-tf-on > .wp-block-cover__background { opacity: 0 !important; }
.lii-time-figuras .lii-tf-art {
  position: absolute; inset: 0; z-index: 0;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--lii-tf-fade, 18%), #000 calc(100% - var(--lii-tf-fade, 18%)), transparent), linear-gradient(to bottom, transparent, #000 var(--lii-tf-fade, 18%), #000 calc(100% - var(--lii-tf-fade, 18%)), transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 var(--lii-tf-fade, 18%), #000 calc(100% - var(--lii-tf-fade, 18%)), transparent), linear-gradient(to bottom, transparent, #000 var(--lii-tf-fade, 18%), #000 calc(100% - var(--lii-tf-fade, 18%)), transparent);
  mask-composite: intersect;
}
.lii-time-figuras .lii-tf-svg { display: block; width: 100%; height: 100%; }
.lii-time-figuras .lii-tf-spin { transform-box: fill-box; transform-origin: center; }
.lii-time-figuras .lii-tf-name {
  position: absolute; left: 6%; bottom: 5%; z-index: 1; max-width: 88%;
  font-family: Anton, Impact, "Arial Narrow", sans-serif; font-weight: 400;
  font-size: min(var(--lii-tf-nome, 28px), 15cqw); line-height: 1; letter-spacing: .01em;
  text-transform: uppercase; color: #060015; white-space: nowrap; overflow: hidden; text-overflow: clip;
}
@media (prefers-reduced-motion: no-preference) {
  .lii-time-figuras .lii-e-person:hover .lii-tf-spin { animation: lii-tf-girar 14s linear infinite; }
  .lii-time-figuras .lii-e-person:hover .lii-tf-spin.is-rev { animation-direction: reverse; }
}
@keyframes lii-tf-girar { to { transform: rotate(360deg); } }
/* Quem tem foto: um véu da cor da seção esconde a foto; ao passar o mouse (ou focar), véu, forma e nome somem. */
.lii-time-figuras .lii-tf-foto { margin: 0; }
.lii-time-figuras .lii-tf-foto::before { content: ""; position: absolute; inset: 0; z-index: 1; background: var(--lii-tf-veu, #FEBC0F); }
.lii-time-figuras .lii-tf-foto > .lii-tf-art { z-index: 2; }
.lii-time-figuras .lii-tf-foto > .lii-tf-name { z-index: 3; }
.lii-time-figuras .lii-tf-foto::before, .lii-time-figuras .lii-tf-foto > .lii-tf-art, .lii-time-figuras .lii-tf-foto > .lii-tf-name { transition: opacity .25s; }
.lii-time-figuras .lii-e-person:is(:hover, :focus-within) .lii-tf-foto::before,
.lii-time-figuras .lii-e-person:is(:hover, :focus-within) .lii-tf-foto > .lii-tf-art,
.lii-time-figuras .lii-e-person:is(:hover, :focus-within) .lii-tf-foto > .lii-tf-name { opacity: 0; }
@media (hover: none) { .lii-time-figuras .lii-tf-foto { cursor: pointer; } }
/* Cartão "+": esconde o + de texto (ficava fora do centro) e desenha um + centralizado por cima do caleidoscópio. */
.lii-time-figuras .lii-tf-mais > .wp-block-cover__inner-container { visibility: hidden; }
.lii-time-figuras .lii-tf-plus { position: absolute; z-index: 2; left: 50%; top: 50%; width: 28%; aspect-ratio: 1; transform: translate(-50%, -50%);
  background: linear-gradient(#060015, #060015) center / 100% 30% no-repeat, linear-gradient(#060015, #060015) center / 30% 100% no-repeat; }
/* Com o nome em Anton no quadro, o título de baixo some da tela (continua para leitores de tela). */
.lii-time-figuras .lii-tf-sem-titulo > h3 { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
