@font-face{font-family:'Source Serif 4';src:url('/assets/source-serif-4-italic.ttf') format('truetype');font-weight:200 900;font-style:italic;font-display:swap}
body:has(.project-detail){background:#30140c}
.project-story{--project-header:88px;position:relative;background:#30140c;color:#fffbf2}
.project-detail{position:relative;background:#30140c;color:#fffbf2}
.project-detail:focus-visible{outline:1px solid #9dc2d1;outline-offset:-2px}
.project-slide{min-height:calc(100svh - var(--project-header));display:grid;grid-template-columns:minmax(0,1fr) min(30vw,440px,calc((100svh - 180px) * .8)) minmax(0,1fr);align-items:center;gap:clamp(24px,3vw,48px);padding:clamp(32px,4vw,64px) clamp(28px,4vw,64px)}
.project-detail__stamp{position:relative;grid-column:2;grid-row:1;width:100%;aspect-ratio:4/5;margin:0;justify-self:center;--stamp-border:clamp(16px,2vw,24px)}
.project-intro .project-detail__stamp{visibility:hidden}
.project-intro .project-detail__copy{opacity:0!important;visibility:hidden}
.project-detail__paper{position:absolute;inset:0;background:#fffbf2;mask-image:radial-gradient(circle at 10px 0,transparent 5px,#000 5.6px),radial-gradient(circle at 10px 100%,transparent 5px,#000 5.6px),radial-gradient(circle at 0 10px,transparent 5px,#000 5.6px),radial-gradient(circle at 100% 10px,transparent 5px,#000 5.6px);mask-size:20px 100%,20px 100%,100% 20px,100% 20px;mask-repeat:repeat-x,repeat-x,repeat-y,repeat-y;mask-composite:intersect}
.project-detail__paper img{position:absolute;inset:var(--stamp-border);width:calc(100% - var(--stamp-border) * 2);height:calc(100% - var(--stamp-border) * 2);object-fit:cover;display:block;background:#e9e0d4}
/* Match the approved home-page fan, including its scale, stacking and rotations. */
.project-detail__art{position:absolute;inset:var(--stamp-border);overflow:hidden}
.project-detail .bionero-cover{background:#f0efe3;isolation:isolate}
.project-detail .bionero-cover__fan{position:absolute;inset:0;transform:scale(.86)}
.project-detail .bionero-cover img.bionero-cover__bag{inset:auto;opacity:1;width:48%;height:73%;object-fit:contain;transform-origin:50% 85%;filter:drop-shadow(0 12px 9px rgb(48 20 12 / .17));background:transparent}
.project-detail .bionero-cover img.bionero-cover__bag--left{left:9%;bottom:19%;transform:rotate(-12deg);z-index:1}
.project-detail .bionero-cover img.bionero-cover__bag--right{right:7%;bottom:21%;transform:rotate(12deg);z-index:2}
.project-detail .bionero-cover img.bionero-cover__bag--front{left:28%;bottom:12%;height:76%;width:49%;transform:rotate(-2deg);z-index:3}
.project-slide--huebsch-designs img{object-fit:contain;background:#f0eee4}
.project-slide--baeckerei-huebsch img{object-fit:contain;background:#e6dcbe}
.project-slide--nelli img{object-fit:contain;background:#eeece6}
.project-detail__animation{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.project-detail__copy{grid-column:3;grid-row:1;min-width:0;padding-bottom:12px;max-width:350px}
.project-detail__copy h2{margin:0 0 clamp(28px,4vw,56px);color:#9dc2d1;font:italic 400 clamp(56px,7.2vw,112px)/1.05 'Source Serif 4',Georgia,serif;letter-spacing:-.055em}
.project-slide--nelli h2,.project-slide--long-title h2{font-size:clamp(42px,5vw,80px)}
.project-detail__copy p{max-width:350px;margin:0;color:#fffbf2;font-size:clamp(14px,1.2vw,17px);line-height:1.85;letter-spacing:-.015em}
.project-detail__sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Equal side columns keep the stamp itself centred; every project shares this exact grid. */
.project-story.is-gallery{height:calc(var(--project-stage-height) + var(--project-scroll-distance))}
.is-gallery .project-detail{position:sticky;top:var(--project-header);height:var(--project-stage-height);overflow:hidden;isolation:isolate}
.is-gallery .project-slide{position:absolute;inset:0;min-height:0}
.is-gallery .project-detail__paper{visibility:hidden}
.is-gallery .project-detail__copy{opacity:var(--copy-opacity,0);pointer-events:none}
.is-gallery.is-native .project-slide.is-current .project-detail__paper{visibility:visible}
@media(max-width:760px){
  .project-story{--project-header:116px}
  .project-slide{grid-template-columns:1fr;gap:28px;padding:28px 28px 36px}
  .project-detail__stamp{grid-column:1;grid-row:1;max-width:360px}
  .project-detail__copy{grid-column:1;grid-row:2;width:100%;max-width:360px;justify-self:center;padding:0}
  .project-detail__copy h2{font-size:clamp(56px,16vw,88px);margin-bottom:16px}
  .project-slide--nelli h2,.project-slide--long-title h2{font-size:clamp(40px,11vw,60px)}
  .is-gallery .project-slide{grid-template-rows:minmax(0,1fr) 190px;gap:20px;padding:20px 24px 24px}
  .is-gallery .project-detail__stamp{max-width:min(280px,calc((100svh - 370px) * .8))}
  .is-gallery .project-detail__copy{align-self:start}
  .is-gallery .project-slide--nelli h2,.is-gallery .project-slide--long-title h2{font-size:40px}
  .is-gallery .project-slide--nelli h2 br,.is-gallery .project-slide--long-title h2 br{display:none}
  .is-gallery .project-detail__copy p{font-size:13px;line-height:1.65}
}
@media(prefers-reduced-motion:reduce){.project-intro .project-detail__stamp,.project-intro .project-detail__copy{visibility:visible;opacity:1!important}.project-detail__animation{display:none}}
/* The project link sits over the rendered stamp; only the current slide is interactive. */
.project-detail__stamp[href]{display:block;color:inherit;cursor:pointer}
.project-detail__copy h2 a{color:inherit}
.project-detail__copy h2 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.1em}
.is-gallery .project-slide{pointer-events:none}
.is-gallery .project-slide.is-current .project-detail__stamp[href],.is-gallery .project-slide.is-current .project-detail__copy a{pointer-events:auto}
.project-detail__stamp[href]:focus-visible{outline:2px solid #9dc2d1;outline-offset:10px}
.project-detail__copy a:focus-visible{outline-color:#9dc2d1}
.is-opening .project-detail__animation,.is-opening .project-detail__stamp{visibility:hidden!important}
.is-opening .project-detail__copy{opacity:0!important;transition:opacity .25s ease}
.project-launch.project-detail{position:fixed;inset:0;background:transparent;perspective:1800px;z-index:90;pointer-events:none}
.project-launch .project-detail__paper{visibility:visible!important}