/* /backup-cloud/ · solo questa pagina (body.pg-backup-cloud) */

.pg-backup-cloud .bk-intro{max-width:48em;margin-bottom:clamp(40px,5vw,64px)}
.pg-backup-cloud .bk-frase{font:700 clamp(32px,3.6vw,52px)/1.05 var(--f-tit);letter-spacing:-.03em;margin-bottom:20px}

/* il percorso dei dati: quattro tappe unite da un filo su cui viaggiano le copie */
.pg-backup-cloud .bk-flusso{margin:0}
.pg-backup-cloud .bk-flusso ol{display:flex;align-items:stretch}
.pg-backup-cloud .bk-t{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--bianco);border-radius:var(--r);padding:clamp(18px,2vw,26px);box-shadow:0 0 0 1px var(--linea) inset}
.pg-backup-cloud .bk-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--sabbia);color:var(--grafite);margin-bottom:8px}
.pg-backup-cloud .bk-ico svg{width:28px;height:28px}
.pg-backup-cloud .bk-t b{font:700 clamp(19px,1.5vw,22px)/1.2 var(--f-tit);letter-spacing:-.015em}
.pg-backup-cloud .bk-s{font:400 13px/1.45 var(--f-mono);color:var(--ferro)}
.pg-backup-cloud .bk-t--rosso{box-shadow:0 0 0 2px var(--rosso) inset}
.pg-backup-cloud .bk-t--rosso .bk-ico{background:var(--rosso);color:#fff}
.pg-backup-cloud .bk-filo{position:relative;flex:0 0 clamp(28px,4vw,64px);align-self:center;height:10px;overflow:hidden}
.pg-backup-cloud .bk-filo::before{content:"";position:absolute;left:0;right:0;top:4px;height:2px;background:var(--linea)}
.pg-backup-cloud .bk-filo span{position:absolute;inset:0;transform:translateX(-100%);animation:bk-va 2.4s cubic-bezier(.5,0,.5,1) infinite}
.pg-backup-cloud .bk-filo span::before{content:"";position:absolute;left:0;right:6px;top:4px;height:2px;background:linear-gradient(90deg,rgba(208,17,36,0),var(--rosso))}
.pg-backup-cloud .bk-filo i{position:absolute;right:0;top:1px;width:8px;height:8px;border-radius:50%;background:var(--rosso)}
.pg-backup-cloud .bk-filo:nth-child(4) span{animation-delay:.8s}
.pg-backup-cloud .bk-filo:nth-child(6) span{animation-delay:1.6s}
@keyframes bk-va{0%{transform:translateX(-100%)}70%,100%{transform:translateX(0)}}
@keyframes bk-giu{0%{transform:translateY(-100%)}70%,100%{transform:translateY(0)}}

@media (max-width:860px){
  .pg-backup-cloud .bk-flusso ol{flex-direction:column}
  .pg-backup-cloud .bk-t{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:16px;row-gap:2px;align-items:center}
  .pg-backup-cloud .bk-ico{grid-row:1/3;margin:0}
  .pg-backup-cloud .bk-filo{flex:0 0 32px;width:10px;height:32px;align-self:flex-start;margin-left:calc(clamp(18px,2vw,26px) + 21px)}
  .pg-backup-cloud .bk-filo::before{left:4px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .pg-backup-cloud .bk-filo span{transform:translateY(-100%);animation-name:bk-giu}
  .pg-backup-cloud .bk-filo span::before{left:4px;right:auto;top:0;bottom:6px;width:2px;height:auto;background:linear-gradient(180deg,rgba(208,17,36,0),var(--rosso))}
  .pg-backup-cloud .bk-filo i{right:auto;left:1px;top:auto;bottom:0}
}
@media (prefers-reduced-motion:reduce){.pg-backup-cloud .bk-filo span{animation:none;transform:none}}