/* tech-anim.css — a prezentáció négy technológia-animációjának stílusa (prezi.css 1721–1823 + reduced-motion), a főoldalon.
   A rajz tinta panelen fut, mint a preziben; a --pz-ink a panel színe (a liposzóma rése ezzel „lyukad”). */
.pst-vis.anim{--pz-ink:var(--ink-900);background:var(--ink-900);border-color:var(--ink-900);padding:clamp(14px,2vw,26px) clamp(12px,2vw,24px);display:grid;place-items:center}
.pst-vis.anim::before,.pst-vis.anim::after{border-color:var(--gold)}
.pst-vis.anim .pz-tv{max-width:none}
@media (min-width:1080px){.pst-stage{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}
/* A négy animáció — közös blueprint-nyelv: 1px vonal, tömör jel, lassú ütem. */
.pz-tv{display:block;width:100%;max-width:612px;height:auto}
.pz-tv-l{fill:none;stroke:color-mix(in srgb,var(--sig) 62%,transparent);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.pz-tv-t{font-family:var(--font-sans);font-size:15px;letter-spacing:.18em;fill:rgba(233,227,214,.5)}
.pz-tv-dim{fill:color-mix(in srgb,var(--sig) 88%,transparent)}
.pz-tv-mh{fill:color-mix(in srgb,var(--sig) 42%,transparent)}

/* 1 · fermentáció — a táp lemegy, a kultúra szaporodik, és értékesebb
   anyag jön vissza fölfelé */
.pz-tv-liq{fill:color-mix(in srgb,var(--sig) 10%,transparent);animation:pzTLiq 6.5s cubic-bezier(.16,1,.3,1) infinite}
.pz-tv-lvl{stroke:var(--sig);stroke-width:1.5;animation:pzTLvl 6.5s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTLiq{0%,100%{transform:translateY(40px) scaleY(.7);transform-origin:50% 284px}58%{transform:none}}
@keyframes pzTLvl{0%,100%{transform:translateY(40px)}58%{transform:none}}
.pz-tv-cell{fill:var(--sig);opacity:0;animation:pzTCell 6.5s ease-in-out infinite}
@keyframes pzTCell{0%,6%{opacity:0;transform:scale(.15)}14%{opacity:1;transform:scale(1.5)}24%,86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.15)}}
.pz-tv-food{fill:none;stroke:rgba(233,227,214,.5);stroke-width:1.3;animation:pzTFood 4.6s ease-in infinite}
@keyframes pzTFood{0%{cy:24px;opacity:0}14%{opacity:.85}72%{cy:196px;opacity:.85}86%,100%{cy:212px;opacity:0}}
.pz-tv-made{fill:var(--sig);opacity:0;filter:drop-shadow(0 0 7px color-mix(in srgb,var(--sig) 55%,transparent));animation:pzTMade 5.2s ease-out infinite}
@keyframes pzTMade{0%{opacity:0;transform:translateY(0) scale(.4)}18%{opacity:1;transform:translateY(-24px) scale(1)}78%{opacity:.9;transform:translateY(-158px) scale(1)}100%{opacity:0;transform:translateY(-196px) scale(.9)}}
.pz-tv-arwd{fill:rgba(233,227,214,.5)}
.pz-tv-bub{display:none}

/* 2 · liposzóma — 9 s-os ív:
   0–14 összeáll · 14–34 a falig megy · 34–48 a fal felőli fele beolvad
   · 44–54 nyílik a lyuk · 52–72 a maradék ív betolja a hatóanyagot
   · 72–82 az ív is beépül · 82–92 bent van */
.pz-tv-cellin{fill:none;stroke:color-mix(in srgb,var(--sig) 34%,transparent);stroke-width:1.2;opacity:0;animation:pzTCin 9s ease infinite}
.pz-tv-cellin ellipse,.pz-tv-cellin circle{fill:none}
@keyframes pzTCin{0%,28%{opacity:0}48%,90%{opacity:1}100%{opacity:0}}
.pz-tv-cin{opacity:0;animation:pzTCin 9s ease infinite;fill:color-mix(in srgb,var(--sig) 62%,transparent)}
.pz-tv-mem{opacity:.6}
.pz-tv-mf1,.pz-tv-mf2{opacity:0}
.pz-tv-mf1 line,.pz-tv-mf2 line{fill:none;stroke:var(--sig);stroke-width:2.2;stroke-linecap:round}
.pz-tv-mf1 circle,.pz-tv-mf2 circle{fill:var(--sig)}
.pz-tv-mf1{animation:pzTMf1 9s ease infinite}
.pz-tv-mf2{animation:pzTMf2 9s ease infinite}
@keyframes pzTMf1{0%,34%{opacity:0}48%,90%{opacity:1}100%{opacity:0}}
@keyframes pzTMf2{0%,72%{opacity:0}82%,90%{opacity:1}100%{opacity:0}}
.pz-tv-gap{fill:var(--pz-ink);opacity:0;animation:pzTGapO 9s ease infinite}
@keyframes pzTGapO{0%,44%{opacity:0}54%,86%{opacity:1}100%{opacity:0}}
/* a gömb csak a falig megy: a jobb széle éppen hozzáér (130+50 → 400) */
.pz-tv-trav{animation:pzTTrav 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTTrav{0%,14%{transform:translateX(0)}34%,100%{transform:translateX(220px)}}
/* a fal felőli fél beolvad a membránba */
.pz-tv-shr{transform-box:fill-box;transform-origin:right center;animation:pzTShR 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTShR{0%,36%{transform:none;opacity:1}50%{transform:scaleX(.14) scaleY(1.2);opacity:.85}58%,90%{transform:scaleX(.1) scaleY(1.2);opacity:0}100%{transform:scaleX(.1) scaleY(1.2);opacity:0}}
/* a maradék ív dugattyúként betolja a hatóanyagot, majd az is beépül */
.pz-tv-shl{transform-box:fill-box;transform-origin:right center;animation:pzTShL 9s cubic-bezier(.22,.9,.24,1) infinite}
@keyframes pzTShL{0%,52%{transform:none;opacity:1}72%{transform:translateX(61px);opacity:1}82%,90%{transform:translateX(61px) scaleX(.12) scaleY(1.2);opacity:0}100%{transform:translateX(61px) scaleX(.12) scaleY(1.2);opacity:0}}
.pz-tv-lip{opacity:0;animation:pzTLip 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTLip{0%{opacity:0;transform:scale(1.6)}12%,90%{opacity:1;transform:none}100%{opacity:0;transform:scale(1.6)}}
.pz-tv-arc{stroke-dasharray:170;animation:pzTArc 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTArc{0%{stroke-dashoffset:170}18%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:170}}
.pz-tv-corew{animation:pzTCoreW 9s cubic-bezier(.22,.9,.24,1) infinite}
@keyframes pzTCoreW{0%,52%{transform:translateX(0)}72%,90%{transform:translateX(170px)}100%{transform:translateX(170px)}}
.pz-tv-core{fill:color-mix(in srgb,var(--sig) 82%,transparent);animation:pzTCore 9s ease-in-out infinite}
@keyframes pzTCore{0%{transform:scale(.4);opacity:.2}16%,90%{transform:scale(1);opacity:1}100%{transform:scale(.4);opacity:0}}
.pz-tv-s1,.pz-tv-s2{opacity:0}
.pz-tv-s1{animation:pzTS1 9s ease infinite}
.pz-tv-s2{animation:pzTS2 9s ease infinite}
@keyframes pzTS1{0%,34%{opacity:0}42%,50%{opacity:1}56%,100%{opacity:0}}
@keyframes pzTS2{0%,54%{opacity:0}62%,88%{opacity:1}100%{opacity:0}}

/* 3 · mikronizálás — ugyanaz a fúzió, kisebb hólyagokkal, nagy felületen */
.pz-tv-bigv{transform-box:fill-box;transform-origin:center;animation:pzTBigV 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTBigV{0%,16%{opacity:1}34%,100%{opacity:.12}}
.pz-tv-core2{fill:color-mix(in srgb,var(--sig) 82%,transparent)}
.pz-tv-arw{opacity:0;animation:pzTArw 9s ease infinite}
@keyframes pzTArw{0%,14%{opacity:0}26%,46%{opacity:.7}58%,100%{opacity:0}}
.pz-tv-surf{opacity:.55}
.pz-tv-cellin2{fill:none;stroke:color-mix(in srgb,var(--sig) 30%,transparent);stroke-width:1.2;opacity:0;animation:pzTCin2 9s ease infinite}
@keyframes pzTCin2{0%,52%{opacity:0}70%,92%{opacity:1}100%{opacity:0}}
.pz-tv-sfuse{opacity:0;animation:pzTSf 9s ease infinite}
.pz-tv-sfuse line{fill:none;stroke:var(--sig);stroke-width:2.2;stroke-linecap:round}
.pz-tv-sfuse circle{fill:var(--sig)}
@keyframes pzTSf{0%,64%{opacity:0}78%,92%{opacity:1}100%{opacity:0}}
.pz-tv-mv{opacity:0;animation:pzTMv 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTMv{0%,14%{opacity:0;transform:translate(116px,104px) scale(.4)}26%{opacity:1;transform:translate(116px,104px) scale(1)}48%,92%{opacity:1;transform:translate(var(--tx),var(--ty)) scale(1)}100%{opacity:0;transform:translate(var(--tx),var(--ty)) scale(1)}}
.pz-tv-mvs{transform-box:fill-box;transform-origin:center bottom;animation:pzTMvs 9s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTMvs{0%,54%{transform:none;opacity:1}70%{transform:scaleY(.18) scaleX(1.32);opacity:.85}80%,100%{transform:scaleY(.12) scaleX(1.44);opacity:0}}
.pz-tv-mvcw{animation:pzTMvc 9s cubic-bezier(.22,.9,.24,1) infinite}
@keyframes pzTMvc{0%,56%{transform:translateY(0);opacity:1}76%,92%{transform:translateY(50px);opacity:1}100%{transform:translateY(50px);opacity:0}}
.pz-tv-fuse2{opacity:0;animation:pzTFuse2 9s ease infinite}
@keyframes pzTFuse2{0%,58%{opacity:0}70%,92%{opacity:1}100%{opacity:0}}

/* 4 · SPG-kivonatolás — 528 Hz-re hangolt zene járja át a folyamatot */
.pz-tv-wave{fill:none;stroke:color-mix(in srgb,var(--sig) 66%,transparent);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:11 13;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--sig) 45%,transparent));animation:pzTWave 2.4s linear infinite}
@keyframes pzTWave{to{stroke-dashoffset:-48}}
.pz-tv-heart{fill:var(--sig);opacity:0;animation:pzTHeart 4s ease-in-out infinite}
@keyframes pzTHeart{0%{opacity:0;transform:translateY(10px) scale(1)}22%{opacity:1;transform:translateY(-6px) scale(2.4)}70%{opacity:.55;transform:translateY(-24px) scale(2.4)}100%{opacity:0;transform:translateY(-40px) scale(2.1)}}
.pz-tv-src{fill:var(--sig)}
.pz-tv-sp,.pz-tv-sp2,.pz-tv-sp3{fill:none;stroke:var(--sig);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:220;stroke-dashoffset:220;animation:pzTDraw 7.5s cubic-bezier(.16,1,.3,1) infinite}
.pz-tv-sp2{stroke-dasharray:44;stroke-dashoffset:44;animation-name:pzTDraw2}
@keyframes pzTDraw{0%,4%{stroke-dashoffset:220}26%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:220}}
@keyframes pzTDraw2{0%,4%{stroke-dashoffset:44}26%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:44}}
.pz-tv-gate{fill:none;stroke:var(--sig);stroke-width:1.4;opacity:0;animation:pzTGate 7.5s ease infinite}
@keyframes pzTGate{0%,10%{opacity:0;transform:scale(.4)}30%,88%{opacity:1;transform:none}100%{opacity:0}}
.pz-tv-join{fill:color-mix(in srgb,var(--sig) 82%,transparent);opacity:0;animation:pzTJoin 7.5s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pzTJoin{0%,26%{opacity:0;transform:scale(.3)}48%,88%{opacity:1;transform:none}100%{opacity:0;transform:scale(.3)}}
.pz-tv-gate,.pz-tv-join,.pz-tv-sm,.pz-tv-big,.pz-tv-core,.pz-tv-lip,.pz-tv-heart,.pz-tv-shell{transform-box:fill-box;transform-origin:center}

/* ══ 16 · A SZIMULÁCIÓ — honnan érkezett a tag, heti rang, újravásárlás,
   mentés · PDF. A piros a Pulse Spike szignálszíne (design system). ══ */
.pzs-slotnote{max-width:1020px;font-size:13.5px}
