/* Free Shipping Bar - Francesco Ingrosso - barra moderna, animata, responsive */
.fsb-wrap{
  --fsb-bg:#eceff4;
  --fsb-fill:#AF2C28;
  --fsb-text:#2b2b2b;
  --fsb-done:#2e7d32;
  margin:1.25rem 0;
  padding:1.1rem 1.25rem 2.6rem;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:14px;
  box-shadow:0 4px 18px rgba(0,0,0,.06);
  font-family:inherit;
  color:var(--fsb-text);
}
.fsb-message{
  display:flex;align-items:center;gap:.5rem;
  font-size:1.02rem;font-weight:600;margin-bottom:1rem;line-height:1.3;
}
.fsb-emoji{font-size:1.25rem;line-height:1}
.fsb-all-reached .fsb-message-text{color:var(--fsb-done)}

.fsb-track{
  position:relative;
  height:14px;
  background:var(--fsb-bg);
  border-radius:999px;
  overflow:visible;
}
.fsb-fill{
  position:absolute;left:0;top:0;height:100%;
  background:linear-gradient(90deg, var(--fsb-fill), color-mix(in srgb, var(--fsb-fill) 70%, #fff));
  border-radius:999px;
  width:0;
  transition:width .9s cubic-bezier(.22,.61,.36,1);
  box-shadow:0 0 0 1px rgba(0,0,0,.04) inset;
}
.fsb-all-reached .fsb-fill{background:linear-gradient(90deg,var(--fsb-done),#66bb6a)}

/* riempimento animato a comparsa */
@keyframes fsbStripes{from{background-position:0 0}to{background-position:28px 0}}
.fsb-fill::after{
  content:"";position:absolute;inset:0;border-radius:999px;
  background-image:linear-gradient(45deg,rgba(255,255,255,.18) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.18) 75%,transparent 75%);
  background-size:28px 28px;
  animation:fsbStripes 1.1s linear infinite;
}

.fsb-milestone{
  position:absolute;top:50%;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;
}
.fsb-dot{
  width:18px;height:18px;border-radius:50%;
  background:#fff;border:3px solid var(--fsb-bg);
  box-shadow:0 1px 4px rgba(0,0,0,.18);
  transition:transform .3s ease,border-color .3s ease,background .3s ease;
}
.fsb-milestone.fsb-reached .fsb-dot{
  background:var(--fsb-done);border-color:#fff;transform:scale(1.15);
}
.fsb-tier-label{
  position:absolute;top:24px;white-space:nowrap;text-align:center;
  font-size:.72rem;line-height:1.15;color:var(--fsb-text);opacity:.85;
}
.fsb-tier-label strong{display:block;font-size:.78rem}
.fsb-tier-label em{display:block;font-style:normal;font-size:.68rem;opacity:.75}
.fsb-milestone.fsb-reached .fsb-tier-label{color:var(--fsb-done);opacity:1}

/* responsive: etichette piu' compatte su mobile */
@media (max-width:560px){
  .fsb-wrap{padding-bottom:2.9rem}
  .fsb-tier-label{font-size:.64rem}
  .fsb-tier-label strong{font-size:.7rem}
  .fsb-message{font-size:.95rem}
}