/* ==============================================================
   SECRET WORD v3 — одна гигантская буква на экран
   ============================================================== */
.swv {
  position: fixed; top: 0; bottom: 0; left: 0; width: 100%;
  z-index: 50;                     /* поверх панелей, под шапкой (z 100) */
  pointer-events: none; user-select: none;
  mix-blend-mode: screen;          /* на тёмном — светится, белый текст не перекрывает */
  opacity: 0; transition: opacity .5s ease;
}
.swv.is-on { opacity: 1; }
.swv > span {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  font-family: 'Unbounded', var(--font-display);
  font-weight: 900;
  line-height: .74;
  letter-spacing: -0.05em;
  white-space: nowrap;
  will-change: transform, opacity;
}
.swv > span::before {
  content: attr(data-l);
  background: linear-gradient(115deg,
    #ff2bd6 0%, #ffe600 14%, #00f0ff 28%, #7a5cff 42%,
    #39ff88 56%, #ff6a00 70%, #ff2bd6 84%, #ffe600 100%);
  background-size: 300% 300%;
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  opacity: .34;
  animation: swFlow 12s linear infinite;
  animation-delay: calc(var(--k, 0) * -0.45s);
}
@keyframes swFlow {
  0%   { background-position: 0% 50%; }
  100% { background-position: 300% 50%; }
}
/* старую пасхалку v2 (буквы внутри блоков) выключаем — только слои,
   внутри которых есть сегменты букв .sw-seg. Реальные абзацы
   «Сильные стороны» (p.sw, стили в styles.css) не трогаем. */
.sw:has(> .sw-seg) { display: none !important; }

@media (max-width: 767px) {
  .swv > span::before { opacity: .3; }
}
@media (prefers-reduced-motion: reduce) {
  .swv > span::before { animation: none; }
}
