/* SFIZIO v2 — product cards (carousel + grid skins) */
.pcard {
  display: grid; grid-template-rows: auto 1fr;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: clip;
  box-shadow: var(--shadow-1);
}
/* inside a carousel: fixed slide width, thumb-friendly */
.hscroll .pcard { width: min(74vw, 19rem); }

.pcard__media { border-radius: 0; }
.pcard__body { padding: var(--sp-4); display: grid; gap: var(--sp-2); align-content: start; }
.pcard__name { font-size: var(--fs-lg); }
.pcard__desc {
  color: var(--muted); font-size: var(--fs-sm); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pcard__foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: var(--sp-2);
}
.pcard .price { font-size: var(--fs-lg); }
/* "Ordina ora" — a stylistic hyperlink, deliberately not a cart control */
.pcard__order {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 2.5rem; padding: 0.45rem 1.05rem;
  border-radius: var(--r-pill);
  background: var(--act); color: #fff;
  font-size: var(--fs-sm); font-weight: 680; letter-spacing: 0.02em;
  transition: transform var(--dur-1) var(--ease-spring), filter var(--dur-1) var(--ease);
}
.pcard__order::after { content: "→"; transition: transform var(--dur-1) var(--ease); }
.pcard__order:hover::after { transform: translateX(3px); }
.pcard__order:active { transform: scale(0.94); }
.pcard--street .pcard__order { background: var(--street-deep); }
.pcard--dining .pcard__order { background: var(--dining-deep); }

/* coming-soon badge (hero + sections) */
.soon {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0.3rem 0.85rem;
  border: 1px dashed currentColor; border-radius: var(--r-pill);
  font-size: var(--fs-xs); font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
}

/* carousel shell: edge-fade + progress bar */
.carousel { position: relative; }
.carousel .hscroll { padding-block: var(--sp-2) var(--sp-4); }
.carousel::before, .carousel::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: var(--gutter);
  z-index: 1; pointer-events: none;
}
.carousel::before { left: 0; background: linear-gradient(90deg, var(--bg), transparent); }
.carousel::after { right: 0; background: linear-gradient(-90deg, var(--bg), transparent); }
.carousel--alt::before { background: linear-gradient(90deg, var(--bg-2), transparent); }
.carousel--alt::after { background: linear-gradient(-90deg, var(--bg-2), transparent); }

.carousel__bar {
  margin: 0 var(--gutter); height: 2px; border-radius: 2px;
  background: var(--line);
  overflow: hidden;
}
.carousel__bar i {
  display: block; height: 100%; width: 100%;
  background: var(--act);
  transform-origin: left; transform: scaleX(0.15);
  transition: transform 80ms linear;
}