/* Homepage-only: a rolling concept ribbon resolves into the actual projects. */
#selected-work.bw-showcase { position:relative; padding:0; color:var(--journey-ink,#f1eee7); }
.bw-showcase-stage { position:relative; padding:100px 0 80px; }
.bw-showcase-intro,.bw-showcase-ribbon { display:none; }
.bw-showcase-results { position:relative; z-index:2; }
.bw-showcase-actions { display:flex; justify-content:flex-end; align-items:center; margin-top:68px; margin-right:clamp(-64px,-3.5vw,-32px); }
.bw-showcase-all { display:inline-flex; align-items:center; gap:24px; min-height:44px; padding:10px 0; border-bottom:1px solid currentColor; font:500 14px/1.4 var(--body,Arial,sans-serif); text-decoration:none; }
.bw-showcase-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.bw-showcase-project { min-width:0; transform-origin:center 35%; }
.bw-showcase-link { display:block; text-decoration:none; }
.bw-showcase-cover { position:relative; aspect-ratio:4/3; border-radius:9px; overflow:hidden; background:#30262a; border:1px solid rgba(241,238,231,.12); }
.bw-showcase-cover img { display:block; width:100%; height:100%; object-fit:contain; }
.bw-showcase-cover::after { content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; box-shadow:inset 0 0 25px rgba(16,11,16,.18); }
.bw-showcase-project-title { display:flex; align-items:center; justify-content:flex-start; gap:14px; padding-top:20px; }
#selected-work .bw-showcase-project h3 { margin:0; font:400 clamp(16.5px,1.426vw,22px)/1.25 var(--brawnd-heading-font,Georgia,serif); letter-spacing:-.025em; }
.bw-showcase-project-title > span { font-size:16px; }
#selected-work .bw-showcase-project p { margin:12px 0 0; color:var(--journey-muted,#c9c3bd); font:400 14px/1.6 var(--body,Arial,sans-serif); max-width:390px; }
#selected-work a:focus-visible { outline:2px solid currentColor; outline-offset:6px; }
/* Only successful JS initialization creates a pinned chapter. */
#selected-work.is-showcase-motion { height:var(--showcase-height); }
.is-showcase-motion .bw-showcase-stage { position:sticky; top:0; min-height:100svh; box-sizing:border-box; padding:120px 0 70px; }
.is-showcase-motion .bw-showcase-intro { display:block; position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.bw-showcase-word { position:absolute; font:400 clamp(58px,8.5vw,148px)/.95 var(--brawnd-heading-font,Georgia,serif); letter-spacing:-.035em; white-space:nowrap; }
.bw-showcase-word--first { left:8%; top:26vh; }
.bw-showcase-word--last { right:8%; top:51vh; }
.is-showcase-motion .bw-showcase-ribbon { display:block; position:absolute; top:0; left:0; width:100%; height:100svh; pointer-events:none; overflow:clip; perspective:1600px; perspective-origin:50% 50%; z-index:3; }
.bw-showcase-orbit { position:absolute; left:50%; top:50%; width:0; height:0; transform-style:preserve-3d; }
.bw-showcase-sheet { position:absolute; left:0; top:0; width:var(--sheet-width,240px); aspect-ratio:16/9; transform-origin:center; transform-style:preserve-3d; border-radius:3px; background:#30262a; box-shadow:0 2px 5px rgba(0,0,0,.13); will-change:transform; }
.bw-showcase-sheet img { display:block; width:100%; height:100%; object-fit:cover; border-radius:inherit; backface-visibility:visible; }
.bw-showcase-sheet--project { aspect-ratio:4/3; }
.bw-showcase-sheet--project img { object-fit:contain; }
.is-showcase-motion .bw-showcase-project { transform:none; }
.is-showcase-motion .bw-showcase-project-title,.is-showcase-motion .bw-showcase-project p { will-change:opacity,transform; }
.is-showcase-motion .bw-showcase-results { perspective:1400px; }
.is-showcase-motion .bw-showcase-actions,.is-showcase-motion .bw-showcase-project { opacity:0; visibility:hidden; }
.is-showcase-motion.is-showcase-settled .bw-showcase-actions,.is-showcase-motion.is-showcase-settled .bw-showcase-project { opacity:1; visibility:visible; }
/* Give the resolved cards more clearance below the desktop navigation.
 * The ribbon measures these same covers, so its landing stays aligned. */
@media(min-width:761px) {
 #selected-work .bw-showcase-stage { padding-top:clamp(168px,20svh,200px); }
}
@media(max-width:760px) {
 .bw-showcase-stage { padding:70px 0 65px; }
 .bw-showcase-results.shell { width:calc(100% - 40px); }
 .bw-showcase-actions { margin-top:52px; margin-right:-8px; }
 .bw-showcase-all { font-size:12px; gap:10px; white-space:nowrap; }
 .bw-showcase-grid { grid-template-columns:1fr; gap:36px; }
 .bw-showcase-project { max-width:520px; width:100%; margin-inline:auto; }
 .is-showcase-motion .bw-showcase-stage { padding-top:105px; }
 .bw-showcase-word { font-size:clamp(48px,12vw,90px); }
 .bw-showcase-word--first { left:5%; top:28vh; }
 .bw-showcase-word--last { right:7%; top:55vh; }
 .is-showcase-motion .bw-showcase-ribbon { perspective:1000px; }
}
@media(prefers-reduced-motion:reduce) {
 #selected-work.is-showcase-motion { height:auto!important; }
 .is-showcase-motion .bw-showcase-stage { position:relative; min-height:0; }
 .bw-showcase-intro,.bw-showcase-ribbon { display:none!important; }
 .is-showcase-motion .bw-showcase-actions,.is-showcase-motion .bw-showcase-project { opacity:1!important; visibility:visible!important; transform:none!important; }
}
@media print {
 #selected-work.is-showcase-motion { height:auto!important; }
 .is-showcase-motion .bw-showcase-stage { position:relative; min-height:0; }
 .bw-showcase-intro,.bw-showcase-ribbon { display:none!important; }
 .is-showcase-motion .bw-showcase-actions,.is-showcase-motion .bw-showcase-project { opacity:1!important; visibility:visible!important; transform:none!important; }
}



/* The reference is a quiet, light canvas with an uninterrupted image ribbon. */
#selected-work.bw-showcase {
  background: #eeefec !important;
  --journey-ink: #f1eee7;
  --journey-muted: #c9c3bd;
  --journey-ink-rgb: 241, 238, 231;
  color: #f1eee7;
}
#selected-work .bw-showcase-results {
  width: min(1120px, 76%);
  margin-inline: auto;
}
#selected-work .bw-showcase-cover {
  aspect-ratio: 4 / 3;
  background: #e2e3df;
  border-color: rgba(39,38,38,.09);
  border-radius: 4px;
}
#selected-work .bw-showcase-cover img { object-fit: cover; }
#selected-work .bw-showcase-cover::after { box-shadow: none; }
#selected-work .bw-showcase-sheet {
  background: #e2e3df;
  box-shadow: 0 3px 12px rgba(0,0,0,.07);
  border-radius: 2px;
  backface-visibility: visible;
}
#selected-work .bw-showcase-sheet--project { aspect-ratio: 16 / 9; }
#selected-work .bw-showcase-sheet img { object-fit: cover; }
#selected-work .bw-showcase-word {
  font-size: clamp(64px, 8.5vw, 148px);
  letter-spacing: -.035em;
  font-weight: 400;
  font-style: normal;
}
#selected-work .bw-showcase-word--first { left: 7%; top: 24vh; }
#selected-work .bw-showcase-word--last { right: 7%; top: 58vh; }
#selected-work .bw-showcase-ribbon { perspective: 1800px; }
@media (max-width: 760px) {
  #selected-work .bw-showcase-results { width: calc(100% - 40px); }
  #selected-work .bw-showcase-word { font-size: clamp(48px, 12vw, 90px); }
  #selected-work .bw-showcase-word--first { top: 23vh; left: 5%; }
  #selected-work .bw-showcase-word--last { top: 65vh; right: 5%; }
  #selected-work .bw-showcase-ribbon { perspective: 1100px; }
}

/* Narrow faces bend each image into the continuous rising ribbon. */
#selected-work.is-showcase-motion .bw-showcase-sheet {
  width: 0; height: 0; aspect-ratio: auto;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
  overflow: visible; opacity: 1; transform-style: preserve-3d;
}
#selected-work.is-showcase-motion .bw-showcase-sheet > img { display: none; }
#selected-work .bw-showcase-strip {
  position: absolute; left: 0; top: 0; display: block;
  overflow: hidden; transform-origin: center;
  backface-visibility: visible; background: #e2e3df;
}
#selected-work .bw-showcase-strip img {
  position: absolute; top: 0; display: block;
  max-width: none; border-radius: 0; object-fit: cover;
}

/* Finished covers use one smooth surface, with their upper edge pinned. */
#selected-work .bw-showcase-cover { overflow: visible; }
#selected-work .bw-showcase-cover > img { border-radius: inherit; }
#selected-work .bw-paper-canvas {
  display: none; position: absolute; pointer-events: none;
}
#selected-work .bw-showcase-cover.is-paper-moving { background: transparent; border-color: transparent; }
#selected-work .bw-showcase-cover.is-paper-moving > img { opacity: 0; }
#selected-work .bw-showcase-cover.is-paper-moving .bw-paper-canvas { display: block; }
@media (prefers-reduced-motion: reduce) {
  #selected-work .bw-paper-canvas { display: none !important; }
  #selected-work .bw-showcase-cover > img { opacity: 1 !important; }
}
@media print {
  #selected-work .bw-paper-canvas { display: none !important; }
  #selected-work .bw-showcase-cover > img { opacity: 1 !important; }
}
