/* CASE LIST — after image is shared with the comparison modal. */
.p-cases { overflow-wrap:anywhere; }
.p-case-grid { max-width:1100px; margin:50px auto 0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:40px; }
.p-case-card { position:relative; min-width:0; }
.p-case-card > img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; transition:opacity .3s; }
.p-case-card h2 { margin:12px 0 0; text-align:center; font-size:.875rem; font-weight:400; line-height:1.7; }
.p-case-card button { position:absolute; inset:0; width:100%; height:100%; min-height:44px; border:0; background:transparent; color:#000; cursor:pointer; }
.p-case-card:focus-within > img { opacity:.7; }
.p-case-plus { position:absolute; right:14px; top:14px; width:24px; height:24px; border:2px solid #fff; border-radius:50%; background:rgb(0 0 0 / .45); }
.p-case-plus::before,.p-case-plus::after { content:''; position:absolute; width:12px; height:2px; top:9px; left:4px; background:#fff; }.p-case-plus::after { transform:rotate(90deg); }
.p-cases-notice { max-width:1100px; margin:32px auto; }
@media (hover:hover) { .p-case-card:hover > img { opacity:.6; } }
@media (max-width:768px) { .p-case-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 16px; margin-top:32px; }.p-case-plus { top:10px; right:10px; } }
@media (prefers-reduced-motion:reduce) { .p-case-card > img { transition:none; } }