/* ============================================================================
   Japan Bike Market — cards.css  (listing cards)
   ============================================================================ */
.listing{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .4s var(--ease), box-shadow .4s, border-color .4s; }
.listing:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--line-2); }
.listing__media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.listing__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.listing:hover .listing__media img{ transform:scale(1.06); }
.listing__cond{ position:absolute; top:.8rem; left:.8rem; font-family:var(--font-sans); font-weight:800; font-size:.72rem; width:26px; height:26px; display:grid; place-items:center; border-radius:8px; background:var(--ink); color:#fff; }
.listing__cond[data-c="S"]{ background:var(--orange); }
.listing__fav{ position:absolute; top:.8rem; right:.8rem; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); display:grid; place-items:center; box-shadow:var(--shadow-sm); transition:.3s; }
.listing__fav svg{ width:16px; height:16px; fill:none; stroke:var(--ink-3); stroke-width:2; transition:.3s; }
.listing__fav:hover{ transform:scale(1.1); } .listing__fav:hover svg{ stroke:var(--orange); fill:var(--orange); }
.listing__cat{ position:absolute; bottom:.8rem; left:.8rem; font-size:.72rem; font-weight:600; padding:.3rem .7rem; border-radius:100px; background:rgba(255,255,255,.92); }
.listing__b{ padding:1.4rem 1.45rem 1.6rem; }
.listing__en{ font-family:var(--font-sans); font-size:.72rem; letter-spacing:.08em; color:var(--muted); }
.listing__name{ font-size:1.25rem; margin:.1rem 0 .5rem; }
.listing__meta{ display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:.9rem; }
.listing__meta span{ font-size:.76rem; color:var(--ink-2); background:var(--paper); border:1px solid var(--line); border-radius:100px; padding:.24rem .6rem; }
.listing__foot{ display:flex; align-items:center; justify-content:space-between; padding-top:.9rem; border-top:1px solid var(--line); }
.listing__price{ font-family:var(--font-sans); font-weight:800; font-size:1.35rem; color:var(--ink); }
.listing__price small{ font-size:.7rem; color:var(--muted); font-weight:500; }
.listing__seller{ display:flex; align-items:center; gap:.4rem; font-size:.76rem; color:var(--muted); margin-top:.8rem; }
.listing__seller .dot{ width:8px; height:8px; border-radius:50%; background:var(--ok); }
.listing__cta{ font-family:var(--font-sans); font-weight:700; font-size:.86rem; color:var(--orange); }