/* ═══════════════════════════════════════════════════════════════════════════
   store-cards-v4.css — Cover + Fade product cards (Interaction Demo v4)
   Applies to cards that carry .pv-cover / .pv-fade (Studio → Inventory →
   Style → Card Style), plus the Classic strip block (.pv4g) near the end.
   Modern / Minimal are untouched.
   Pieces: swipeable image strip (arrows on hover, dots), glass status tag,
   VIEW pill with a sliding arrow, quick-add cart button with a hop + check.
   Interactions live in js/pacco-motion.js (store) — the Studio preview gets
   the same look without the behaviour.
   ═══════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:"PcoBricolage";src:url("../assets/fonts/pco-bricolage.woff2") format("woff2");font-weight:400 800;font-stretch:75% 100%;font-display:swap}

.product-card.pv-cover,.product-card.pv-fade{
  --v4-ink:#0c0b0f;--v4-out:cubic-bezier(.16,1,.3,1);--v4-pop:cubic-bezier(.34,1.45,.55,1);
  --v4-display:"PcoBricolage",Inter,ui-sans-serif,system-ui,sans-serif;
  border:0 !important;overflow:hidden;isolation:isolate;
  transition:transform .6s var(--v4-out),box-shadow .6s var(--v4-out) !important;
}
.product-card.pv-cover:hover,.product-card.pv-fade:hover{transform:translateY(-5px)}

/* ── Image strip ─────────────────────────────────────────────────────── */
.product-card.pv4 .pv4-media{position:relative;padding:0 !important;isolation:isolate;cursor:pointer}
.product-card.pv4 .pv4-track{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-user-select:none;user-select:none}
.product-card.pv4 .pv4-track::-webkit-scrollbar{display:none}
.product-card.pv4 .pv4-track.drag{cursor:grabbing;scroll-snap-type:none}
.product-card.pv4 .pv4-slide{position:relative;flex:0 0 100%;height:100%;scroll-snap-align:start;overflow:hidden}
.product-card.pv4 .pv4-slide img{-webkit-user-drag:none;transition:transform 1.1s var(--v4-out) !important}
.product-card.pv4:hover .pv4-slide .product-media-visual>div{transition:scale 1.1s var(--v4-out);scale:1.035}
.product-card.pv4 .pv4-slide .product-media-visual>div{transition:scale 1.1s var(--v4-out)}

/* Arrows: whole side zones on desktop hover; hidden on touch */
.product-card.pv4 .pv4-nav{position:absolute;top:0;bottom:0;z-index:3;width:30%;display:flex;align-items:center;padding:0 12px;border:0;background:none;color:var(--v4-ink);cursor:pointer;opacity:0;transition:opacity .3s}
.product-card.pv4 .pv4-nav.prev{left:0;justify-content:flex-start}
.product-card.pv4 .pv4-nav.next{right:0;justify-content:flex-end}
.product-card.pv4 .pv4-nav svg{width:34px;height:34px;padding:8px;border-radius:50%;background:rgba(255,255,255,.86);box-shadow:0 6px 16px -8px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .45s var(--v4-pop),background .2s}
.product-card.pv4 .pv4-nav.prev svg{transform:translateX(-6px)}
.product-card.pv4 .pv4-nav.next svg{transform:translateX(6px)}
.product-card.pv4:hover .pv4-nav,.product-card.pv4 .pv4-nav:focus-visible{opacity:1}
.product-card.pv4:hover .pv4-nav svg{transform:none}
.product-card.pv4 .pv4-nav.prev:hover svg{transform:translateX(-3px)}
.product-card.pv4 .pv4-nav.next:hover svg{transform:translateX(3px)}
.product-card.pv4 .pv4-nav:active svg{transform:scale(.88)}
.product-card.pv4 .pv4-ind{position:absolute;left:50%;bottom:14px;z-index:3;display:flex;gap:4px;padding:5px 7px;border-radius:99px;background:rgba(12,11,15,.24);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform:translateX(-50%);opacity:0;pointer-events:none;transition:opacity .3s}
.product-card.pv4:hover .pv4-ind{opacity:1}
.product-card.pv4 .pv4-ind i{display:block;width:5px;height:5px;border-radius:99px;background:rgba(255,255,255,.55);transition:width .4s var(--v4-out),background .3s}
.product-card.pv4 .pv4-ind i.on{width:14px;background:#fff}
@media (hover:none){
  .product-card.pv4 .pv4-nav{display:none}
  .product-card.pv4 .pv4-ind{opacity:1}
}

/* Glass status tag (transparent badge) on the photo */
.product-card.pv4 .pv4-tags{position:absolute;left:12px;top:12px;z-index:3;display:flex;gap:6px;pointer-events:none}
.product-card.pv4 .pv4-tags .prod-status-badge{display:inline-flex !important;align-items:center;gap:6px;height:26px;margin:0 !important;padding:0 11px !important;border-radius:99px !important;border:1px solid rgba(255,255,255,.24) !important;background:rgba(24,24,28,.46) !important;color:#fff !important;font-size:11px !important;font-weight:750 !important;letter-spacing:.02em !important;text-transform:none !important;-webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3);box-shadow:none !important}
.product-card.pv4 .pv4-tags .prod-status-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;opacity:.9}
.product-card.pv4 .pv4-tags .prod-status-badge.new::before{background:#ff5a4f;opacity:1}
.product-card.pv4 .pv4-tags .prod-status-badge.best_seller::before,.product-card.pv4 .pv4-tags .prod-status-badge.hot::before{background:#ffc800;opacity:1}
.product-card.pv4 .pv4-tags .prod-status-badge.limited::before{background:#7a5cff;opacity:1}
.product-card.pv4 .pv4-tags .prod-status-badge.sale::before{background:#4cc38a;opacity:1}
.product-card.pv4 .pv4-tags .prod-status-badge.coming_soon::before,.product-card.pv4 .pv4-tags .prod-status-badge.paused::before{background:#c7c7cf}

/* ── VIEW pill + quick-add cart (ref 1) ──────────────────────────────── */
.product-card.pv4 .pv4-act{display:flex;gap:8px;margin-top:14px}
.product-card.pv4 .pv4-view{flex:1;min-width:0;height:48px;padding:0 18px;border:0;border-radius:999px;background:var(--pacco-button-bg,#0c0b0f);color:var(--pacco-button-color,#fff);display:inline-flex;align-items:center;justify-content:center;gap:10px;font:inherit;font-size:14px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;overflow:hidden;white-space:nowrap;transition:transform .4s var(--v4-pop),filter .25s,background .25s}
.product-card.pv4 .pv4-view:hover{filter:brightness(1.18)}
.product-card.pv4 .pv4-view:active{transform:scale(.97)}
.product-card.pv4 .pv4-ar{display:inline-grid;overflow:hidden}
.product-card.pv4 .pv4-ar i{grid-area:1/1;font-style:normal;transition:transform .45s var(--v4-out)}
.product-card.pv4 .pv4-ar i+i{transform:translateX(-130%)}
.product-card.pv4 .pv4-view:hover .pv4-ar i:first-child{transform:translateX(130%)}
.product-card.pv4 .pv4-view:hover .pv4-ar i+i{transform:none}
.product-card.pv4 .pv4-add{position:relative;flex:none;width:48px;height:48px;border:0;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--v4-ink);box-shadow:inset 0 0 0 1.5px #dcdce0;isolation:isolate;overflow:hidden;cursor:pointer;transition:color .35s,transform .45s var(--v4-pop)}
.product-card.pv4 .pv4-add::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;background:var(--v4-ink);transform:scale(0);transition:transform .55s var(--v4-out)}
.product-card.pv4 .pv4-add .pv4-cart{grid-area:1/1;width:24px;height:24px;transition:transform .55s var(--v4-out)}
.product-card.pv4 .pv4-add .pv4-badge{position:absolute;top:8px;right:7px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#e5321f;color:#fff;box-shadow:0 0 0 2px #fff;transform:scale(0);opacity:0;transition:transform .5s cubic-bezier(.34,1.7,.5,1),opacity .15s,background .3s,box-shadow .35s}
.product-card.pv4 .pv4-add .pv4-badge svg{grid-area:1/1;display:block;width:10px;height:10px;transition:transform .5s cubic-bezier(.34,1.5,.5,1),opacity .2s}
.product-card.pv4 .pv4-add .b-plus{transform:rotate(-90deg)}
.product-card.pv4 .pv4-add .b-ok{transform:scale(0) rotate(-40deg);opacity:0}
.product-card.pv4 .pv4-add:hover,.product-card.pv4 .pv4-add:focus-visible,.product-card.pv4 .pv4-add.ok{color:#fff}
.product-card.pv4 .pv4-add:hover::before,.product-card.pv4 .pv4-add:focus-visible::before,.product-card.pv4 .pv4-add.ok::before{transform:scale(1)}
.product-card.pv4 .pv4-add:hover .pv4-badge,.product-card.pv4 .pv4-add:focus-visible .pv4-badge,.product-card.pv4 .pv4-add.ok .pv4-badge{transform:none;opacity:1;box-shadow:0 0 0 2px var(--v4-ink)}
.product-card.pv4 .pv4-add:hover .b-plus,.product-card.pv4 .pv4-add:focus-visible .b-plus{transform:none}
.product-card.pv4 .pv4-add:hover .pv4-cart,.product-card.pv4 .pv4-add:focus-visible .pv4-cart{transform:translateX(-2px)}
.product-card.pv4 .pv4-add:active{transform:scale(.92)}
.product-card.pv4 .pv4-add.ok .pv4-cart{animation:pv4Hop .6s var(--v4-out)}
.product-card.pv4 .pv4-add.ok .pv4-badge{background:#1a9b4b}
.product-card.pv4 .pv4-add.ok .b-plus{transform:scale(0) rotate(90deg);opacity:0}
.product-card.pv4 .pv4-add.ok .b-ok{transform:none;opacity:1}
@keyframes pv4Hop{0%{transform:translateX(-2px)}35%{transform:translate(1px,-4px) rotate(-8deg)}70%{transform:translateX(-2px) rotate(3deg)}100%{transform:translateX(-2px)}}

/* Shared body type */
.product-card.pv4 .product-title{font-family:var(--v4-display) !important;font-weight:800 !important;font-stretch:75%;text-transform:uppercase;letter-spacing:-.005em !important;line-height:1 !important}
.product-card.pv4 .product-title-row{margin:0 !important;min-height:0 !important}
.product-card.pv4 .product-footer-row{display:block !important;margin:0 !important}
.product-card.pv4 .product-meta{display:flex !important;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:6px 10px;margin:0 !important}
.product-card.pv4 .price-line--placeholder{display:none !important}

/* ═════════ COVER: the photo is the card; text sits on a soft blur ═════════ */
.product-card.pv4.pv-cover{position:relative;display:block !important;aspect-ratio:3/4;border-radius:28px !important;background:#16151a !important;color:#fff;box-shadow:0 1px 2px rgba(12,11,15,.06),0 22px 44px -26px rgba(12,11,15,.5) !important}
.product-card.pv4.pv-cover:hover{box-shadow:0 2px 4px rgba(12,11,15,.06),0 34px 54px -26px rgba(12,11,15,.55) !important}
.product-card.pv4.pv-cover .pv4-media{position:absolute !important;inset:0;aspect-ratio:auto !important;height:100% !important;border-radius:0 !important;background:#16151a !important}
.product-card.pv4.pv-cover .pv4-media .product-media-visual{background:transparent !important}
.product-card.pv4.pv-cover .pv4-slide img{object-position:center 30% !important}
.product-card.pv4.pv-cover .pv4-nav{bottom:42%}
.product-card.pv4.pv-cover .pv4-ind{top:14px;bottom:auto;left:auto;right:14px;transform:none}
.product-card.pv4.pv-cover .pv4-body{position:absolute !important;left:0;right:0;bottom:0;z-index:4;display:flex !important;flex-direction:column;gap:0;padding:54px 14px 14px !important;border:0 !important;background:none !important;color:#fff;pointer-events:none}
.product-card.pv4.pv-cover .pv4-body>*{pointer-events:auto}
.product-card.pv4.pv-cover .pv4-body::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to top,rgba(10,9,13,.86),rgba(10,9,13,.42) 58%,rgba(10,9,13,0));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-mask-image:linear-gradient(to top,#000 55%,transparent);mask-image:linear-gradient(to top,#000 55%,transparent);transition:opacity .5s}
.product-card.pv4.pv-cover .product-kicker{order:2;margin:6px 0 0 !important;color:rgba(255,255,255,.7) !important;font-size:11px !important;font-weight:700 !important;letter-spacing:.06em !important}
.product-card.pv4.pv-cover .product-kicker:empty,.product-card.pv4.pv-cover .product-kicker span:empty{display:none}
.product-card.pv4.pv-cover .product-title-row{order:1;padding-right:0}
.product-card.pv4.pv-cover .product-title{color:#fff !important;font-size:clamp(20px,1.7vw,26px) !important}
.product-card.pv4.pv-cover .product-desc{order:3;max-height:0;margin:0 !important;overflow:hidden;color:rgba(255,255,255,.72) !important;font-size:12.5px !important;line-height:1.4 !important;opacity:0;transition:max-height .6s var(--v4-out),opacity .4s,margin .6s var(--v4-out)}
.product-card.pv4.pv-cover:hover .product-desc{max-height:3.2em;opacity:1;margin-top:6px !important}
.product-card.pv4.pv-cover.desc-hidden .product-desc{display:none !important}
.product-card.pv4.pv-cover .swatches{order:4;display:flex !important;gap:6px;margin:8px 0 0 !important}
.product-card.pv4.pv-cover .swatches .swatch{width:14px !important;height:14px !important;box-shadow:0 0 0 1.5px rgba(255,255,255,.75) !important;border:0 !important}
.product-card.pv4.pv-cover .product-footer-row{order:5;margin-top:10px !important}
.product-card.pv4.pv-cover .price,.product-card.pv4.pv-cover .sale-price,.product-card.pv4.pv-cover .normal-price{color:#fff !important;font-size:17px !important;font-weight:750 !important}
.product-card.pv4.pv-cover .original-price{color:rgba(255,255,255,.6) !important;font-size:11px !important}
.product-card.pv4.pv-cover .sale-badge{color:#ffc800 !important;background:transparent !important}
.product-card.pv4.pv-cover .stock-badge{height:24px;display:inline-flex !important;align-items:center;padding:0 10px !important;border-radius:99px !important;border:1px solid rgba(255,255,255,.2) !important;background:rgba(255,255,255,.14) !important;color:#fff !important;font-size:10.5px !important;font-weight:750 !important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.product-card.pv4.pv-cover .stock-badge.low{background:rgba(229,50,31,.35) !important;border-color:rgba(255,140,120,.4) !important}
.product-card.pv4.pv-cover .pv4-act{order:6;margin-top:12px}
.product-card.pv4.pv-cover .pv4-view{height:44px;background:#fff;color:var(--v4-ink);font-size:12.5px}
.product-card.pv4.pv-cover .pv4-view:hover{filter:none;background:#f0f0f3}
.product-card.pv4.pv-cover .pv4-add{width:44px;height:44px;background:rgba(255,255,255,.16);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.product-card.pv4.pv-cover .pv4-add::before{background:#fff}
.product-card.pv4.pv-cover .pv4-add:hover,.product-card.pv4.pv-cover .pv4-add:focus-visible,.product-card.pv4.pv-cover .pv4-add.ok{color:var(--v4-ink)}
.product-card.pv4.pv-cover .pv4-add .pv4-badge{box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.product-card.pv4.pv-cover .pv4-add:hover .pv4-badge,.product-card.pv4.pv-cover .pv4-add.ok .pv4-badge{box-shadow:0 0 0 2px #fff}
.product-card.pv4.pv-cover .sold-out-banner{z-index:4}

/* ═════════ FADE: the photo melts into the card through a blur ═════════ */
.product-card.pv4.pv-fade{border-radius:28px !important;padding:6px 6px 0 !important;background:var(--paco-card-bg,#fff) !important;box-shadow:0 1px 2px rgba(12,11,15,.05),0 16px 36px -18px rgba(12,11,15,.24) !important}
.product-card.pv4.pv-fade:hover{box-shadow:0 2px 4px rgba(12,11,15,.05),0 30px 46px -22px rgba(12,11,15,.34) !important}
.product-card.pv4.pv-fade .pv4-media{border-radius:23px !important;overflow:hidden;isolation:isolate;-webkit-clip-path:inset(0 round 23px);clip-path:inset(0 round 23px)}
.product-card.pv4.pv-fade .pv4-media::before{content:"";border-radius:0 0 23px 23px;position:absolute;left:0;right:0;bottom:0;height:44%;z-index:2;pointer-events:none;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 78%);mask-image:linear-gradient(to bottom,transparent,#000 78%)}
.product-card.pv4.pv-fade .pv4-media::after{content:"";border-radius:0 0 23px 23px;position:absolute;left:0;right:0;bottom:-1px;height:46%;z-index:2;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,.86) 52%,var(--paco-card-bg,#fff) 76%)}
.product-card.pv4.pv-fade .pv4-ind{top:14px;bottom:auto;left:auto;right:14px;transform:none}
.product-card.pv4.pv-fade .pv4-nav{bottom:0}
.product-card.pv4.pv-fade .pv4-body{position:relative;z-index:3;margin-top:-62px !important;display:grid !important;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name price" "coll coll" "desc desc" "dots dots" "act act";align-items:end;column-gap:10px;padding:0 12px 14px !important;border:0 !important;background:none !important}
.product-card.pv4.pv-fade .product-title-row{grid-area:name;min-width:0}
.product-card.pv4.pv-fade .product-title{font-size:clamp(20px,1.8vw,26px) !important;color:var(--paco-title-color,var(--v4-ink)) !important}
.product-card.pv4.pv-fade .product-footer-row{grid-area:price;align-self:end}
.product-card.pv4.pv-fade .product-meta{flex-direction:column;align-items:flex-end;gap:2px}
.product-card.pv4.pv-fade .price,.product-card.pv4.pv-fade .sale-price,.product-card.pv4.pv-fade .normal-price{font-size:18px !important;font-weight:650 !important;color:var(--paco-price-color,var(--v4-ink)) !important}
.product-card.pv4.pv-fade .price-group{align-items:flex-end !important;text-align:right}
.product-card.pv4.pv-fade .original-price{font-size:11px !important}
.product-card.pv4.pv-fade .sale-badge{display:none !important}
.product-card.pv4.pv-fade .stock-badge{display:none !important}
.product-card.pv4.pv-fade .stock-badge.low{display:inline-flex !important;padding:2px 8px !important;border-radius:99px !important;font-size:10px !important}
.product-card.pv4.pv-fade .product-kicker{grid-area:coll;margin:5px 0 0 !important;color:rgba(12,11,15,.42) !important;font-size:13.5px !important;font-weight:600 !important;letter-spacing:0 !important;text-transform:none !important}
.product-card.pv4.pv-fade .product-desc{grid-area:desc;margin:6px 0 0 !important;font-size:13px !important;line-height:1.45 !important;font-weight:500;color:rgba(12,11,15,.52) !important}
.product-card.pv4.pv-fade.desc-hidden .product-desc{display:none !important}
.product-card.pv4.pv-fade .swatches{grid-area:dots;display:flex !important;gap:7px;margin:12px 0 0 !important}
.product-card.pv4.pv-fade .swatches .swatch{width:18px !important;height:18px !important;border:0 !important;box-shadow:inset 0 0 0 1px rgba(12,11,15,.1) !important}
.product-card.pv4.pv-fade .pv4-act{grid-area:act;margin-top:14px}
.product-card.pv4.pv-fade .pv4-view{height:50px}

/* ── Phones: two per row ─────────────────────────────────────────────── */
@media (max-width:640px){
  .product-card.pv4 .pv4-act{gap:6px;margin-top:10px}
  .product-card.pv4 .pv4-view{height:38px;padding:0 8px;font-size:11.5px;letter-spacing:.05em;gap:6px}
  .product-card.pv4 .pv4-add{width:38px;height:38px}
  .product-card.pv4 .pv4-add .pv4-cart{width:20px;height:20px}
  .product-card.pv4 .pv4-add .pv4-badge{top:5px;right:4px;width:14px;height:14px}
  .product-card.pv4 .pv4-add .pv4-badge svg{width:8px;height:8px}
  .product-card.pv4 .pv4-tags{left:8px;top:8px}
  .product-card.pv4 .pv4-tags .prod-status-badge{height:22px;padding:0 9px !important;font-size:10px !important}
  .product-card.pv4 .pv4-ind{bottom:8px}
  .product-card.pv4.pv-cover{border-radius:22px !important;aspect-ratio:3/4.4}
  .product-card.pv4.pv-cover .pv4-body{padding:30px 9px 9px !important}
  .product-card.pv4.pv-cover .product-title{font-size:16px !important}
  .product-card.pv4.pv-cover .product-kicker,.product-card.pv4.pv-cover .swatches{display:none !important}
  .product-card.pv4.pv-cover .price,.product-card.pv4.pv-cover .sale-price,.product-card.pv4.pv-cover .normal-price{font-size:14px !important}
  .product-card.pv4.pv-cover .original-price,.product-card.pv4.pv-cover .sale-badge,.product-card.pv4.pv-cover .stock-badge:not(.low){display:none !important}
  .product-card.pv4.pv-cover .pv4-ind{top:9px;right:9px}
  .product-card.pv4.pv-cover .pv4-view{height:34px;font-size:11px}
  .product-card.pv4.pv-cover .pv4-add{width:34px;height:34px}
  .product-card.pv4.pv-cover .pv4-add .pv4-cart{width:18px;height:18px}
  .product-card.pv4.pv-fade{border-radius:22px !important;padding:4px 4px 0 !important}
  .product-card.pv4.pv-fade .pv4-media{border-radius:18px !important;-webkit-clip-path:inset(0 round 18px);clip-path:inset(0 round 18px)}
  .product-card.pv4.pv-fade .pv4-media::before,.product-card.pv4.pv-fade .pv4-media::after{border-radius:0 0 18px 18px}
  .product-card.pv4.pv-fade .pv4-body{margin-top:-48px !important;padding:0 8px 10px !important;grid-template-areas:"name name" "price price" "coll coll" "desc desc" "dots dots" "act act"}
  .product-card.pv4.pv-fade .product-footer-row{justify-self:start;margin-top:4px !important}
  .product-card.pv4.pv-fade .product-meta{align-items:flex-start}
  .product-card.pv4.pv-fade .price-group{align-items:flex-start !important;text-align:left}
  .product-card.pv4.pv-fade .product-title{font-size:17px !important}
  .product-card.pv4.pv-fade .price,.product-card.pv4.pv-fade .sale-price,.product-card.pv4.pv-fade .normal-price{font-size:14.5px !important}
  .product-card.pv4.pv-fade .product-kicker{font-size:11.5px !important}
  .product-card.pv4.pv-fade .product-desc{font-size:11.5px !important}
  .product-card.pv4.pv-fade .swatches .swatch{width:14px !important;height:14px !important}
  .product-card.pv4.pv-fade .pv4-view{height:38px}
  .product-card.pv4.pv-fade .pv4-ind,.product-card.pv4.pv-cover .pv4-ind{top:10px;right:9px;padding:4px 6px}
}

/* ═════════ CLASSIC on the store page: image strip + arrows + quick add ═════════
   Cards carry .pv4g (js/pacco-shared.js, opts.classicGallery). The classic
   look (border, body, VIEW) is untouched; the photo becomes a swipe strip and a
   round cart button sits beside VIEW when one tap can buy the product. */
.product-card.pv4g{--v4-ink:#0c0b0f;--v4-out:cubic-bezier(.16,1,.3,1);--v4-pop:cubic-bezier(.34,1.45,.55,1)}
/* ── Classic + strip (store page) ─────────────────────────────────────────────────────── */
.product-card.pv4g .pv4-media{position:relative;padding:0 !important;isolation:isolate;cursor:pointer}
.product-card.pv4g .pv4-track{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-user-select:none;user-select:none}
.product-card.pv4g .pv4-track::-webkit-scrollbar{display:none}
.product-card.pv4g .pv4-track.drag{cursor:grabbing;scroll-snap-type:none}
.product-card.pv4g .pv4-slide{position:relative;flex:0 0 100%;height:100%;scroll-snap-align:start;overflow:hidden}
.product-card.pv4g .pv4-slide img{-webkit-user-drag:none;transition:transform 1.1s var(--v4-out) !important}
.product-card.pv4g:hover .pv4-slide .product-media-visual>div{transition:scale 1.1s var(--v4-out);scale:1.035}
.product-card.pv4g .pv4-slide .product-media-visual>div{transition:scale 1.1s var(--v4-out)}

/* Arrows: whole side zones on desktop hover; hidden on touch */
.product-card.pv4g .pv4-nav{position:absolute;top:0;bottom:0;z-index:3;width:30%;display:flex;align-items:center;padding:0 12px;border:0;background:none;color:var(--v4-ink);cursor:pointer;opacity:0;transition:opacity .3s}
.product-card.pv4g .pv4-nav.prev{left:0;justify-content:flex-start}
.product-card.pv4g .pv4-nav.next{right:0;justify-content:flex-end}
.product-card.pv4g .pv4-nav svg{width:34px;height:34px;padding:8px;border-radius:50%;background:rgba(255,255,255,.86);box-shadow:0 6px 16px -8px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .45s var(--v4-pop),background .2s}
.product-card.pv4g .pv4-nav.prev svg{transform:translateX(-6px)}
.product-card.pv4g .pv4-nav.next svg{transform:translateX(6px)}
.product-card.pv4g:hover .pv4-nav,.product-card.pv4g .pv4-nav:focus-visible{opacity:1}
.product-card.pv4g:hover .pv4-nav svg{transform:none}
.product-card.pv4g .pv4-nav.prev:hover svg{transform:translateX(-3px)}
.product-card.pv4g .pv4-nav.next:hover svg{transform:translateX(3px)}
.product-card.pv4g .pv4-nav:active svg{transform:scale(.88)}
.product-card.pv4g .pv4-ind{position:absolute;left:50%;bottom:14px;z-index:3;display:flex;gap:4px;padding:5px 7px;border-radius:99px;background:rgba(12,11,15,.24);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform:translateX(-50%);opacity:0;pointer-events:none;transition:opacity .3s}
.product-card.pv4g:hover .pv4-ind{opacity:1}
.product-card.pv4g .pv4-ind i{display:block;width:5px;height:5px;border-radius:99px;background:rgba(255,255,255,.55);transition:width .4s var(--v4-out),background .3s}
.product-card.pv4g .pv4-ind i.on{width:14px;background:#fff}
@media (hover:none){
  .product-card.pv4g .pv4-nav{display:none}
  .product-card.pv4g .pv4-ind{opacity:1}
}

.product-card.pv4g .pv4-add{position:relative;flex:none;width:48px;height:48px;border:0;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--v4-ink);box-shadow:inset 0 0 0 1.5px #dcdce0;isolation:isolate;overflow:hidden;cursor:pointer;transition:color .35s,transform .45s var(--v4-pop)}
.product-card.pv4g .pv4-add::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;background:var(--v4-ink);transform:scale(0);transition:transform .55s var(--v4-out)}
.product-card.pv4g .pv4-add .pv4-cart{grid-area:1/1;width:24px;height:24px;transition:transform .55s var(--v4-out)}
.product-card.pv4g .pv4-add .pv4-badge{position:absolute;top:8px;right:7px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#e5321f;color:#fff;box-shadow:0 0 0 2px #fff;transform:scale(0);opacity:0;transition:transform .5s cubic-bezier(.34,1.7,.5,1),opacity .15s,background .3s,box-shadow .35s}
.product-card.pv4g .pv4-add .pv4-badge svg{grid-area:1/1;display:block;width:10px;height:10px;transition:transform .5s cubic-bezier(.34,1.5,.5,1),opacity .2s}
.product-card.pv4g .pv4-add .b-plus{transform:rotate(-90deg)}
.product-card.pv4g .pv4-add .b-ok{transform:scale(0) rotate(-40deg);opacity:0}
.product-card.pv4g .pv4-add:hover,.product-card.pv4g .pv4-add:focus-visible,.product-card.pv4g .pv4-add.ok{color:#fff}
.product-card.pv4g .pv4-add:hover::before,.product-card.pv4g .pv4-add:focus-visible::before,.product-card.pv4g .pv4-add.ok::before{transform:scale(1)}
.product-card.pv4g .pv4-add:hover .pv4-badge,.product-card.pv4g .pv4-add:focus-visible .pv4-badge,.product-card.pv4g .pv4-add.ok .pv4-badge{transform:none;opacity:1;box-shadow:0 0 0 2px var(--v4-ink)}
.product-card.pv4g .pv4-add:hover .b-plus,.product-card.pv4g .pv4-add:focus-visible .b-plus{transform:none}
.product-card.pv4g .pv4-add:hover .pv4-cart,.product-card.pv4g .pv4-add:focus-visible .pv4-cart{transform:translateX(-2px)}
.product-card.pv4g .pv4-add:active{transform:scale(.92)}
.product-card.pv4g .pv4-add.ok .pv4-cart{animation:pv4Hop .6s var(--v4-out)}
.product-card.pv4g .pv4-add.ok .pv4-badge{background:#1a9b4b}
.product-card.pv4g .pv4-add.ok .b-plus{transform:scale(0) rotate(90deg);opacity:0}
.product-card.pv4g .pv4-add.ok .b-ok{transform:none;opacity:1}
.product-card.pv4g .pcg-act{--pcg-h:48px;display:flex;align-items:center;gap:10px;width:100%}
.product-card.pv4g .pcg-act .pacco-product-btn{flex:1 1 auto;min-width:0;width:auto !important;height:var(--pcg-h) !important;min-height:0 !important;margin:0 !important}
/* Perfect circle, same height as the VIEW pill; soft grey fill (no outline) so it reads as its own control */
.product-card.pv4g .pcg-act .pv4-add{flex:none;box-sizing:border-box;width:var(--pcg-h);min-width:var(--pcg-h);max-width:var(--pcg-h);height:var(--pcg-h);min-height:var(--pcg-h);max-height:var(--pcg-h);aspect-ratio:1/1;border-radius:50%;align-self:center;padding:0;background:#f0f0f3;box-shadow:none}
.product-card.pv4g .pcg-act .pv4-add .pv4-badge{top:9px;right:8px}
@media (max-width:640px){.product-card.pv4g .pcg-act{--pcg-h:44px;gap:8px}.product-card.pv4g .pcg-act .pv4-add .pv4-cart{width:22px;height:22px}.product-card.pv4g .pcg-act .pv4-add .pv4-badge{top:7px;right:6px}}
/* Cart present (ref 4): the round quick-add already covers the buy action, so
   VIEW drops its arrow and reads plainly. */
.product-card.pv4g .pcg-act:has(.pv4-add) .pacco-product-btn [aria-hidden="true"]{display:none}
.product-card.pv4g .pv4-media .sold-out-banner{z-index:4}

@media (prefers-reduced-motion:reduce){
  .product-card.pv-cover,.product-card.pv-fade,.product-card.pv4 *,.product-card.pv4g .pv4-media *,.product-card.pv4g .pv4-add *{transition:none !important;animation:none !important}
}

/* Studio style preview: the hand-built preview card carries a plain image and
   the classic VIEW button instead of the store strip / pill. */
.product-card.pv4 .pv4-media>img{position:absolute;inset:0;width:100% !important;height:100% !important;object-fit:cover !important}
.product-card.pv4 .product-footer-row .pacco-product-btn{width:100%;height:44px;margin-top:12px;border-radius:999px !important}
.product-card.pv4.pv-cover .product-footer-row .pacco-product-btn{background:#fff !important;color:#0c0b0f !important;border-color:#fff !important}
.product-card.pv4.pv-fade .product-footer-row{grid-row:auto}
.product-card.pv4.pv-fade .product-footer-row:has(.pacco-product-btn){grid-column:1/-1}