/* ═══════════════════════════════════════════════════════════════════════════════
   🌤️ МЕКА ПОЯВА · секциите изплуват при превъртане · 23.09.2026 (D7 от ПЛАН_УЛТРА)
   Досега старите секции на началото цъфваха рязко — премиум светът диша, а те не.
   Сега всяка секция и всяка карта в нея се повдига мъничко и изплува веднъж.
   ЗАЩИТА: работи САМО когато js/pl-poyava.js е сложил html.pl-poyava (без JS нищо
   не е скрито — важно, защото скритото без JS би било невидимо съдържание).
   ПЪТ НАЗАД: махни <link>/<script> на pl-poyava от index.html (нищо друго не зависи).
   ═══════════════════════════════════════════════════════════════════════════════ */

html.pl-poyava .pl-pv {
  opacity: .001;
  transform: translate3d(0, 18px, 0) scale(.988);
  transition: opacity .62s cubic-bezier(.22, .9, .3, 1), transform .62s cubic-bezier(.22, .9, .3, 1);
  transition-delay: var(--pv-d, 0ms);
  will-change: opacity, transform;
}
html.pl-poyava .pl-pv.pl-vid {
  opacity: 1;
  transform: none;
  will-change: auto;
}

/* децата вътре се подреждат едно след друго — „разгръщане“, не „включване“ */
html.pl-poyava .pl-pv-d {
  opacity: .001;
  transform: translate3d(0, 12px, 0);
  transition: opacity .5s ease-out, transform .55s cubic-bezier(.22, .9, .3, 1);
  transition-delay: var(--pv-d, 0ms);
}
html.pl-poyava .pl-pv-d.pl-vid { opacity: 1; transform: none; }

/* заглавието на секцията идва с мъничко закъснение след филца */
html.pl-poyava .pl-pv.pl-vid > .section-title,
html.pl-poyava .pl-pv.pl-vid > h2,
html.pl-poyava .pl-pv.pl-vid > h3 { animation: plPvT .7s cubic-bezier(.2, .9, .3, 1) both; animation-delay: .12s; }
@keyframes plPvT { from { opacity: .4; transform: translateY(8px); letter-spacing: .02em; } /* 24.10: от .4 (скрит таб) */ to { opacity: 1; transform: none; } }

/* мама е на телефон и бърза: щом е стигнала веднъж, повече не се крие (.pl-vid остава) */
@media (prefers-reduced-motion: reduce) {
  html.pl-poyava .pl-pv,
  html.pl-poyava .pl-pv-d { opacity: 1 !important; transform: none !important; transition: none !important; }
  html.pl-poyava .pl-pv.pl-vid > .section-title,
  html.pl-poyava .pl-pv.pl-vid > h2,
  html.pl-poyava .pl-pv.pl-vid > h3 { animation: none; }
}
