/* ============================================================================
   Japan Bike Hub — cards.css  (bike cards, tilt, category, news, testimonial)
   ============================================================================ */

/* Bike card */
.bike{ position:relative; border-radius:var(--radius-lg); overflow:hidden; background:var(--grad-steel); border:1px solid var(--line); transition:transform .5s var(--ease), border-color .5s, box-shadow .5s; transform-style:preserve-3d; }
.bike:hover{ border-color:var(--line-2); box-shadow:var(--shadow); }
.bike__media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.bike__media img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease), filter .6s; filter:saturate(.9) contrast(1.05); }
.bike:hover .bike__media img{ transform:scale(1.08); filter:saturate(1.1); }
.bike__cat{ position:absolute; top:1rem; left:1rem; z-index:2; font-family:var(--font-en); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; padding:.4rem .8rem; border-radius:100px; background:rgba(6,7,10,.6); border:1px solid var(--line-2); backdrop-filter:blur(8px); }
.bike__body{ padding:1.5rem 1.5rem 1.7rem; }
.bike__jp{ color:var(--silver-dim); font-size:.85rem; }
.bike__name{ font-size:1.5rem; margin:.2rem 0 .5rem; }
.bike__desc{ color:var(--silver-dim); font-size:.92rem; min-height:3.2em; }
.bike__specs{ display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; margin:1.2rem 0; padding:1rem 0; border-block:1px solid var(--line); }
.bike__specs div{ text-align:center; }
.bike__specs .n{ font-family:var(--font-en); font-weight:700; font-size:1.15rem; color:var(--blue); }
.bike__specs .l{ font-size:.66rem; color:var(--silver-dim); letter-spacing:.08em; }
.bike__foot{ display:flex; align-items:center; justify-content:space-between; }
.bike__price{ font-family:var(--font-en); font-weight:700; font-size:1.15rem; }

/* Category tile */
.cat-tile{ position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:3/4; display:flex; align-items:flex-end; }
.bike__tech{ margin:.55rem 0 0; font-size:.78rem; letter-spacing:.04em; color:var(--blue); opacity:.9; }
.cat-tile img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); filter:brightness(.88) saturate(.95); }
.cat-tile:hover img{ transform:scale(1.08); }
.cat-tile::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 48%, rgba(5,6,10,.62)); }
.cat-tile__body{ position:relative; z-index:2; padding:1.6rem; width:100%; }
.cat-tile__en{ font-family:var(--font-en); letter-spacing:.24em; font-size:.7rem; color:var(--blue); }
.cat-tile__jp{ font-size:1.5rem; font-weight:900; margin-top:.3rem; }

/* Feature (tech) card — glass */
.feat{ padding:2.1rem; border-radius:var(--radius); background:var(--grad-glass); border:1px solid var(--line); backdrop-filter:blur(10px); transition:transform .5s var(--ease), border-color .5s; }
.feat:hover{ transform:translateY(-4px); border-color:var(--line-2); }
.feat__ic{ width:52px; height:52px; border-radius:14px; display:grid; place-items:center; background:rgba(61,169,255,.12); border:1px solid var(--line-2); margin-bottom:1.2rem; }
.feat__ic svg{ width:24px; height:24px; stroke:var(--blue); fill:none; stroke-width:1.6; }
.feat h3{ font-size:1.25rem; margin-bottom:.6rem; }
.feat p{ color:var(--silver-dim); font-size:.94rem; }

/* News card */
.news{ display:grid; grid-template-rows:auto 1fr; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--ink-2); transition:transform .5s var(--ease), border-color .5s; }
.news:hover{ transform:translateY(-6px); border-color:var(--line-2); }
.news__media{ aspect-ratio:16/10; overflow:hidden; }
.news__media img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.news:hover .news__media img{ transform:scale(1.07); }
.news__body{ padding:1.4rem; display:flex; flex-direction:column; gap:.6rem; }
.news__meta{ display:flex; gap:.8rem; align-items:center; font-family:var(--font-en); font-size:.72rem; letter-spacing:.1em; color:var(--silver-dim); }
.news__cat{ color:var(--blue); }
.news__title{ font-size:1.12rem; line-height:1.4; font-weight:700; }
.news__x{ color:var(--silver-dim); font-size:.88rem; }

/* Testimonial */
.quote{ padding:2.2rem; border-radius:var(--radius); background:var(--grad-steel); border:1px solid var(--line); }
.quote__mark{ font-family:var(--font-en); font-size:3rem; color:var(--blue); line-height:.6; }
.quote__x{ font-size:1.08rem; margin:.6rem 0 1.4rem; }
.quote__who{ display:flex; align-items:center; gap:.8rem; }
.quote__av{ width:44px; height:44px; border-radius:50%; background:var(--grad-blue); }
.quote__n{ font-weight:700; }
.quote__r{ color:var(--silver-dim); font-size:.82rem; }