/* TD Effetti: classi da mettere nel campo "Classe" (Advanced) di qualsiasi elemento, colonna o sezione YOOtheme
   td-fx-reveal | td-fx-left | td-fx-right  comparsa all'ingresso in vista (dal basso, da sinistra, da destra)
   td-fx-delay-300                          ritardo in millisecondi
   td-fx-words                              titolo che sale parola per parola
   td-fx-stagger (+ td-fx-start-550 td-fx-step-120 td-fx-alt td-fx-pop)  voci interne in sequenza
   td-fx-clip                               foto che si apre e si avvicina scorrendo
   td-fx-parallax                           foto con leggero parallasse
   td-fx-fill                               testo che si riempie di colore scorrendo
   td-fx-line                               linea sfumata sotto il titolo
   td-fx-draw                               SVG che si disegna (tracciato, poi riempimento; i cerchi cadono)
   Niente si muove da solo: tutto parte quando entra in vista o segue lo scorrimento */
.td-fx-rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--td-d,0ms)}
.td-fx-rv.td-fx-rl{transform:translateX(-46px)}
.td-fx-rv.td-fx-rr{transform:translateX(46px)}
.td-fx-rv.td-fx-in{opacity:1;transform:none}
.td-fx-words-on .td-fx-w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em}
.td-fx-words-on .td-fx-w>span{display:inline-block;transform:translateY(105%);transition:transform 1s cubic-bezier(.2,.75,.15,1);transition-delay:var(--td-d,0ms)}
.td-fx-words-on.td-fx-in .td-fx-w>span{transform:none}
.td-fx-pop-on .td-fx-in .el-title,.td-fx-pop-on .td-fx-in>b{animation:tdFxPop .7s cubic-bezier(.2,.8,.2,1.3) both;animation-delay:calc(var(--td-d,0ms) + 200ms)}
@keyframes tdFxPop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.td-fx-clip-on{clip-path:inset(0 calc(var(--td-c,1) * 7%) round calc(12px + var(--td-c,1) * 14px));will-change:clip-path}
.td-fx-clip-on img{transform:scale(calc(1 + var(--td-c,1) * .14)) translateY(calc(var(--td-y,0) * 1px));will-change:transform}
.td-fx-par-on{overflow:hidden;border-radius:12px}
.td-fx-par-on img{transform:scale(1.12) translateY(calc(var(--td-y,0) * 1px));will-change:transform}
.td-fx-fill-on .td-fx-wd{color:rgba(86,96,122,.28);transition:color .25s}
.td-fx-fill-on .td-fx-wd.td-fx-on{color:inherit}
.td-fx-fill-on .td-fx-wd:not(.td-fx-on){color:color-mix(in srgb,currentColor 28%,transparent)}
.td-fx-lineel{display:block;height:2px;max-width:220px;margin-top:22px;background:linear-gradient(90deg,#4BAEAA,#b8894f);transform-origin:left;transform:scaleX(0);transition:transform 1.2s cubic-bezier(.2,.7,.2,1);transition-delay:var(--td-d,0ms)}
.td-fx-in .td-fx-lineel,.td-fx-lineel.td-fx-in{transform:scaleX(1)}
.td-fx-draw-on svg{overflow:visible;max-width:100%;height:auto}
.td-fx-draw-on svg path{fill-opacity:0;stroke:var(--td-stroke,currentColor);stroke-width:5;stroke-linejoin:round;stroke-dasharray:var(--td-len,6000);stroke-dashoffset:var(--td-len,6000)}
.td-fx-draw-on svg circle{transform-box:fill-box;transform-origin:center;transform:translateY(-260%) scale(.4);opacity:0}
.td-fx-draw-on svg .td-fx-ring{fill:none!important;stroke:var(--td-ring,currentColor);stroke-width:4;transform:none;opacity:0}
.td-fx-draw-on.td-fx-go svg path{animation:tdFxDraw 2.2s cubic-bezier(.55,.1,.3,1) forwards,tdFxFill .9s ease 1.9s forwards}
.td-fx-draw-on.td-fx-go svg circle:not(.td-fx-ring){animation:tdFxDrop .9s cubic-bezier(.3,1.5,.5,1) 2.3s forwards}
.td-fx-draw-on.td-fx-go svg .td-fx-ring{animation:tdFxRing 1.2s ease-out 2.75s forwards}
.td-fx-draw-on svg:hover circle:not(.td-fx-ring){animation:tdFxHop .7s cubic-bezier(.3,1.6,.5,1)}
@keyframes tdFxDraw{to{stroke-dashoffset:0}}
@keyframes tdFxFill{to{fill-opacity:1;stroke-width:0}}
@keyframes tdFxDrop{0%{opacity:0;transform:translateY(-260%) scale(.4)}40%{opacity:1}100%{opacity:1;transform:none}}
@keyframes tdFxRing{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(3.2)}}
@keyframes tdFxHop{0%{transform:none;opacity:1}40%{transform:translateY(-55%);opacity:1}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){
  .td-fx-rv,.td-fx-words-on .td-fx-w>span{opacity:1!important;transform:none!important;transition:none!important}
  .td-fx-clip-on{clip-path:none!important}.td-fx-clip-on img,.td-fx-par-on img{transform:none!important}
  .td-fx-fill-on .td-fx-wd{color:inherit!important}
  .td-fx-draw-on svg path{fill-opacity:1;stroke-dashoffset:0;animation:none!important}
  .td-fx-draw-on svg circle{opacity:1;transform:none;animation:none!important}.td-fx-draw-on svg .td-fx-ring{display:none}
  .td-fx-lineel{transform:none;transition:none}
}