/* Home page project showcase -- draggable card pile (desktop) / swipe row (phones) */
.showcase-stage{position:relative;margin-top:28px;--sc-ease:cubic-bezier(.23,1,.32,1);}
.showcase-backdrop{display:none;
  position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(560px,80%);margin:0;
  text-align:center;pointer-events:none;user-select:none;z-index:0;
  font-family:var(--font-display);font-weight:700;font-size:clamp(28px,4.4vw,56px);line-height:1.1;
  color:rgba(20,32,61,.09);
}
.showcase-hint{display:none;text-align:center;margin:10px 0 0;font-size:12px;color:var(--ink-faint);letter-spacing:.3px;}

/* ---- default (phones, no-JS): a swipeable row ------------------------- */
.showcase-cards{position:relative;z-index:1;display:flex;gap:16px;overflow-x:auto;padding:8px 4px 22px;margin:0;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.showcase-card{flex:0 0 min(240px,72vw);scroll-snap-align:center;}
.sc-inner{position:relative;background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px;
  box-shadow:0 14px 34px -18px rgba(20,32,61,.45);overflow:hidden;
  transition:transform 180ms var(--sc-ease),box-shadow 180ms var(--sc-ease);}
.sc-inner img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:8px;background:var(--paper-alt);
  -webkit-user-drag:none;user-select:none;pointer-events:none;}
.sc-inner h3{margin:12px 2px 2px;font-family:var(--font-display);font-size:19px;line-height:1.25;color:var(--ink);}
.sc-line{margin:0 2px 8px;font-size:12.5px;color:var(--ink-soft);}
.sc-link{display:inline-block;margin:0 2px 2px;font-size:13px;font-weight:700;color:var(--brand);text-decoration:none;}
.sc-link:hover{text-decoration:underline;}
.sc-link:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:4px;}
.sc-glare{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;}

/* ---- desktop: scattered pile, set up by showcase.js ------------------- */
.showcase-stage.is-scatter .showcase-cards{display:block;overflow:visible;padding:0;height:var(--sc-h,560px);perspective:3000px;}
.showcase-stage.is-scatter .showcase-card{position:absolute;left:0;top:0;width:var(--sc-w,240px);flex:none;
  cursor:grab;touch-action:none;will-change:transform;user-select:none;-webkit-user-select:none;transform-style:preserve-3d;}
.showcase-stage.is-scatter .showcase-card.is-dragging{cursor:grabbing;}
.showcase-stage.is-scatter .showcase-card.is-dragging .sc-inner{box-shadow:0 30px 60px -20px rgba(20,32,61,.55);}
@media (hover:hover) and (pointer:fine){
  .showcase-stage.is-scatter .showcase-card:not(.is-dragging):hover .sc-inner{transform:scale(1.02);}
}
.showcase-stage.is-scatter .showcase-hint,.showcase-stage.is-scatter .showcase-backdrop{display:block;}

@media (prefers-reduced-motion:reduce){
  .sc-inner{transition:none;}
  .showcase-stage.is-scatter .showcase-card:not(.is-dragging):hover .sc-inner{transform:none;}
}
