/*
 * Card .pc (prodotto o linea) — da design/css/alba.css (.pc) + stili inline di 03-food-service.
 * Handle "alba-card", usato da product-card e lines-grid.
 * Differenze volute rispetto al sorgente:
 * - il sollevamento usa `translate` invece di `transform`: così non viene annullato
 *   dall'animazione di reveal .rv (che anima `transform` con fill-mode both);
 * - lo stato :focus-visible rivela anche secchiello e info (nel sorgente scopriva lo stage vuoto);
 * - .is-open = stato hover su touch (primo tap), gestito da assets/js/card.js.
 */
.pc{position:relative;display:block;width:100%;height:var(--pc-h,520px);box-sizing:border-box;border-radius:var(--wp--custom--radius--card,28px);overflow:hidden;background:#fff;text-decoration:none;color:var(--ink);isolation:isolate;border:0;padding:0;text-align:left;cursor:pointer;font:inherit;transition:translate .6s var(--ease),box-shadow .6s}
.pc:hover,.pc:focus{color:var(--ink);text-decoration:none}
.pc:hover,.pc.is-open{translate:0 -6px;box-shadow:var(--wp--preset--shadow--card)}
.pc:focus-visible{outline:3px solid var(--green);outline-offset:4px}

.pc .tex{position:absolute;inset:0;z-index:2;clip-path:inset(0 0 0 0);transition:clip-path .85s var(--wipe)}
.pc .tex:not(.jam){background:var(--ink)} /* senza foto: fondo .jam del colore della card */
.pc:hover .tex,.pc:focus-visible .tex,.pc.sel .tex,.pc.is-open .tex{clip-path:inset(0 0 100% 0)}
.pc .pc-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pc .pc-shade{position:absolute;left:0;right:0;bottom:0;height:62%;background:linear-gradient(to top,rgba(27,23,18,.82),rgba(27,23,18,0))}
.pc .tname{position:absolute;left:26px;right:26px;bottom:24px;display:flex;flex-direction:column;gap:10px;color:#fff}
.pc .pc-kicker{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.pc .tname .disp{font-size:46px}

.pc .stg{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:24px 26px}
.pc .halo{position:absolute;left:50%;top:45%;width:64%;aspect-ratio:1;border-radius:50%;background:var(--pc-halo,var(--red));transform:translate(-50%,-50%) scale(.3);opacity:.22;transition:transform 1.1s var(--ease)}
.pc:hover .halo,.pc:focus-visible .halo,.pc.sel .halo,.pc.is-open .halo{transform:translate(-50%,-50%) scale(1)}
.pc .bk{position:absolute;left:50%;top:45%;width:var(--bk-w,220px);height:auto;transform:translate(-50%,-20%) scale(.75) rotate(-10deg);opacity:0;transition:transform 1s var(--ease) .12s,opacity .5s .12s}
.pc:hover .bk,.pc:focus-visible .bk,.pc.sel .bk,.pc.is-open .bk{transform:translate(-50%,-50%);opacity:1}
.pc .top{position:relative;display:flex;justify-content:space-between;align-items:center}
.pc .pc-pack{font-size:12px;font-weight:700;margin-left:auto}
.pc .inf{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;opacity:0;transform:translateY(14px);transition:opacity .5s .3s,transform .6s var(--ease) .3s}
.pc:hover .inf,.pc:focus-visible .inf,.pc.sel .inf,.pc.is-open .inf{opacity:1;transform:none}
.pc .pc-txt{display:flex;flex-direction:column;gap:8px}
.pc .inf .h3{font-size:30px;margin:0}
.pc .inf p{font-size:15px;line-height:1.5;margin:0}
.pc .go{width:52px;height:52px;border-radius:999px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pc.sel{box-shadow:0 0 0 3px var(--green)}

@media (prefers-reduced-motion: reduce){
	.pc,.pc *{transition-duration:.01ms!important;transition-delay:0s!important}
}
