/* =====================================================================
   IL LOGO ANIMATO «TRACCIATO» NEL CRM -- MARCA_85773_LOGO_TRACCIATO_CRM
   D591, 1 ottobre 2026. Giovanni: «il logo usa il secondo, ovungue sl crm
   scial sito ecc».

   DOVE: pagina di accesso, pagina del codice (secondo passaggio) e primo
   avvio. Il logo del menu laterale resta quello fermo di sempre, e
   l'icona della linguetta non cambia.

   COME SI MUOVE: una volta sola per visita (la classe rp-logo-anima su
   <html> la mette la riga di programma in cima alla pagina, e la toglie
   dopo 3 secondi). In 2,3 secondi: un filo sottile disegna il bollo, il
   rame si apre dal centro, la sedia si traccia, il nome entra da
   sinistra dietro una tenda morbida. Poi resta fermo. Ricaricando la
   pagina (per esempio dopo una password sbagliata) e' gia' fermo.
   Chi ha chiesto «riduci movimento» lo vede sempre fermo.

   Senza questo foglio il disegno si vede lo stesso, fermo e intero.
   Il disegno sta in templates/_logo_tracciato_85773.html.
   Lo toglie la consegna 85774.
   ===================================================================== */
.rp-tracciato{display:block; width:100%; height:auto; overflow:visible}
.rp-tracciato .rpt-nome{fill:var(--rp-testo,#2b2320)}
.rp-tracciato .rpt-nota{fill:var(--rp-nota,#70675d)}
.rp-tracciato .rpt-anello{opacity:0}

/* dove sta: il pannello scuro grande, il riquadro scuro piccolo (qui senza la frase,
   che a quella misura sarebbe troppo piccola per leggerla), il primo avvio */
.accesso.la-login .rp-logo-pannello{width:360px; max-width:100%; --rp-testo:#faf6f1; --rp-nota:#948a7e;
  margin-bottom:6px}
.accesso.la-login .accesso-logo.rp-logo-riquadro{padding:16px 22px; --rp-testo:#faf6f1; --rp-nota:#948a7e}
.accesso.la-login .accesso-logo.rp-logo-riquadro .rp-tracciato{width:228px; max-width:100%}
.pa-marchio.rp-logo-primo{max-width:300px; --rp-testo:var(--ink-strong,#2b2320); --rp-nota:var(--ink-3,#70675d)}
@media (max-width:360px){.pa-marchio.rp-logo-primo{max-width:250px}}

/* il movimento, solo la prima volta */
html.rp-logo-anima .rp-tracciato .rpt-anello{stroke-dasharray:1 1;
  animation:rpt-anello 1.05s cubic-bezier(.65,0,.35,1) both}
html.rp-logo-anima .rp-tracciato .rpt-disco{transform-box:fill-box; transform-origin:center;
  animation:rpt-disco .75s cubic-bezier(.16,1,.3,1) .5s both}
html.rp-logo-anima .rp-tracciato .rpt-tr{stroke-dasharray:1 1;
  animation:rpt-tratto .46s cubic-bezier(.65,0,.35,1) .9s both}
html.rp-logo-anima .rp-tracciato .rpt-t2{animation-delay:1s}
html.rp-logo-anima .rp-tracciato .rpt-t3{animation-delay:1.12s}
html.rp-logo-anima .rp-tracciato .rpt-t4{animation-delay:1.2s}
html.rp-logo-anima .rp-tracciato .rpt-tenda{animation:rpt-tenda .95s cubic-bezier(.33,1,.68,1) 1.12s both}
html.rp-logo-anima .rp-tracciato .rpt-tenda2{animation:rpt-tenda .8s cubic-bezier(.33,1,.68,1) 1.5s both}
html.rp-logo-anima .rp-tracciato .rpt-nome{animation:rpt-scivola .95s cubic-bezier(.16,1,.3,1) 1.12s both}
@keyframes rpt-anello{0%{opacity:1;stroke-dashoffset:1}70%{opacity:1;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}}
@keyframes rpt-disco{from{opacity:0;transform:scale(.18)}30%{opacity:1}to{opacity:1;transform:none}}
@keyframes rpt-tratto{from{stroke-dashoffset:1;opacity:0}8%{opacity:1}to{stroke-dashoffset:0;opacity:1}}
@keyframes rpt-tenda{from{transform:translateX(-285px)}to{transform:none}}
@keyframes rpt-scivola{from{transform:translateX(-7px)}to{transform:none}}

@media (prefers-reduced-motion:reduce){
  html.rp-logo-anima .rp-tracciato *{animation:none !important}
}