.poster-project {
  --poster-warm: #f5a17b;
  --poster-stage-height: clamp(340px, 32vw, 490px);
  max-width: 1540px;
  margin: 0 auto;
  padding: 106px 40px 56px;
}
body.mode-arch .poster-project { --surface-soft:#eeebe5; --poster-warm:#9e482c; --accent:var(--accent-strong); }
.poster-intro-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:17px 22px; border-radius:14px; background:var(--surface-soft); color:var(--muted); font:10px/1.6 var(--font-mono); letter-spacing:.08em; }
.poster-intro-bar > span::before { content:'●'; color:var(--accent); margin-right:10px; }
.poster-back { color:var(--text); text-decoration:none; white-space:nowrap; }
.poster-back:hover { color:var(--accent); }
.poster-heading { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.65fr); gap:6vw; align-items:end; padding:68px 0 76px; }
.poster-heading h1 { margin:0; color:var(--text); font:600 clamp(70px,8.8vw,138px)/.94 var(--font-sans); letter-spacing:-.075em; }
.poster-heading h1 em { color:var(--poster-warm); font-style:normal; }
.poster-heading h1 span { color:var(--accent); }
.poster-heading aside { padding-bottom:5px; }
.poster-heading p { max-width:350px; margin:0 0 18px; font-size:19px; line-height:1.45; }
.poster-intro-note { color:var(--muted); font:11px/1.7 var(--font-mono); }
.poster-explore { display:flex; width:fit-content; align-items:center; margin-top:24px; padding:11px 19px; border:1px solid var(--muted); border-radius:999px; color:var(--text); font-size:12px; text-decoration:none; }
.poster-explore:hover { border-color:var(--accent); color:var(--accent); }
.poster-work { scroll-margin-top:100px; }
.poster-controls { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(280px,.85fr); gap:36px; }
.poster-filter-row { min-width:0; }
.poster-filter-row h2 { margin:0 0 14px; color:var(--muted); font:500 10px/1.5 var(--font-mono); letter-spacing:.14em; text-transform:uppercase; }
.poster-filters { display:flex; flex-wrap:wrap; gap:8px; }
.poster-filters button { min-height:44px; padding:10px 16px; border:1px solid var(--border); border-radius:999px; background:var(--surface-soft); color:var(--text); font:12px/1.4 var(--font-sans); cursor:pointer; transition:background .18s,color .18s,border-color .18s; }
.poster-filters button[aria-pressed="true"] { border-color:var(--text); background:var(--text); color:var(--bg); }
.poster-filters button:hover { border-color:var(--accent); }
.poster-countline { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:30px 0 23px; }
.poster-countline h2,.poster-countline p { margin:0; color:var(--muted); font:11px/1.6 var(--font-mono); }
.poster-countline h2 { color:var(--text); font-weight:400; }
.poster-projects { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); align-items:start; gap:22px; }
.poster-project-card { grid-column:span 6; min-width:0; }
.poster-project-card[data-span="8"] { grid-column:span 8; }
.poster-project-card[data-span="4"] { grid-column:span 4; }
.poster-project-card[data-span="5"] { grid-column:span 5; }
.poster-project-card[data-span="7"] { grid-column:span 7; }
.poster-project-card[data-span="12"] { grid-column:span 12; }
.poster-project-card[hidden] { display:none; }
.poster-visual { overflow:hidden; border-radius:25px; background:#bea5e1; }
.poster-project-card:nth-child(4n+2) .poster-visual { background:#efb28f; }
.poster-project-card:nth-child(4n+3) .poster-visual { background:#ced8ae; }
.poster-project-card:nth-child(4n+4) .poster-visual { background:#9695c8; }
.poster-stack { position:relative; display:grid; place-items:center; isolation:isolate; width:100%; height:var(--poster-stage-height); padding:36px; border:0; background:transparent; cursor:zoom-in; }
.poster-stack img { display:none; grid-area:1/1; width:auto; height:auto; max-width:100%; max-height:calc(var(--poster-stage-height) - 72px); clip-path:inset(.65%); box-shadow:0 12px 28px #0003; transition:transform .25s; }
.poster-stack img:first-child { display:block; z-index:2; }
.poster-stack.is-ready img { display:none; }
.poster-stack.is-ready img.is-cover { display:block; z-index:2; }
.poster-stack.is-ready img.is-back { display:block; z-index:1; transform:translate(12px,9px) rotate(3deg); opacity:.8; }
@media (hover:hover) { .poster-stack:hover img.is-cover { transform:translate(-3px,-3px); } .poster-stack:hover img.is-back { transform:translate(16px,12px) rotate(4deg); } }
.poster-stack-count { position:absolute; z-index:3; right:18px; bottom:17px; padding:5px 9px; border-radius:999px; background:#06080cd9; color:#f3f0ee; font:10px/1.5 var(--font-mono); }
.poster-project-meta { display:flex; flex-direction:column; gap:6px; padding:17px 5px 22px; }
.poster-project-meta h2 { margin:0; color:var(--text); font:500 23px/1.2 var(--font-sans); letter-spacing:-.035em; }
.poster-project-meta > span { color:var(--muted); font-size:12px; line-height:1.5; }
.poster-empty { padding:50px 0 75px; color:var(--muted); font-size:14px; }
.poster-footer { display:flex; justify-content:space-between; align-items:end; gap:35px; margin-top:65px; padding:46px 52px; border-radius:26px; background:var(--surface-soft); }
.poster-footer > strong { color:var(--poster-warm); font:600 clamp(64px,8vw,110px)/.85 var(--font-sans); letter-spacing:-.08em; }
.poster-footer > div { max-width:440px; }
.poster-footer p { margin:0 0 10px; color:var(--muted); font-size:12px; line-height:1.75; }
.poster-footer a { display:inline-block; margin-top:7px; color:var(--accent); font-size:13px; text-decoration:none; }
.poster-lightbox { position:fixed; inset:0; width:100%; max-width:none; height:100%; max-height:none; margin:0; padding:72px 40px 28px; border:0; background:var(--bg); color:var(--text); }
.poster-lightbox[open] { display:grid; align-items:center; }
body.mode-arch .poster-lightbox { --surface-soft:#eeebe5; --accent:var(--accent-strong); }
html.custom-cursor-active .poster-lightbox,html.custom-cursor-active .poster-lightbox * { cursor:auto !important; }
html.custom-cursor-active .poster-lightbox button { cursor:pointer !important; }
.poster-lightbox::backdrop { background:rgba(4,6,10,.8); }
.poster-lightbox-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,320px); align-items:center; gap:clamp(24px,3vw,48px); width:100%; max-width:1600px; margin:0 auto; min-height:0; }
.poster-lightbox-stage { display:grid; grid-template-rows:minmax(0,1fr) auto; gap:20px; height:calc(100dvh - 100px); min-width:0; min-height:0; }
.poster-lightbox-image { display:grid; place-items:center; min-height:0; min-width:0; }
.poster-lightbox img { display:block; max-width:100%; max-height:calc(100dvh - 164px); width:auto; height:auto; object-fit:contain; clip-path:inset(.65%); }
.poster-lightbox button { min-width:44px; min-height:44px; padding:8px 12px; border:0; border-radius:999px; background:var(--surface-soft); color:var(--text); font:11px/1.5 var(--font-mono); cursor:pointer; }
.poster-lightbox-close { position:absolute; top:16px; right:20px; }
.poster-lightbox-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.poster-lightbox-caption { flex:1; margin:0; color:var(--muted); text-align:center; font:10px/1.6 var(--font-mono); }
.poster-lightbox-details { padding:30px; border-radius:20px; background:var(--surface-soft); max-height:calc(100dvh - 140px); overflow-y:auto; }
.poster-detail-kicker { display:block; margin-bottom:22px; color:var(--accent); font:10px/1.5 var(--font-mono); letter-spacing:.1em; text-transform:uppercase; }
.poster-lightbox-details h2 { margin:0 0 13px; font:400 36px/1.12 var(--font-display); letter-spacing:-.035em; }
.poster-detail-venue { margin:0 0 26px; color:var(--muted); font:10px/1.7 var(--font-mono); }
.poster-detail-description { margin:0; color:var(--text-secondary); font-size:14px; line-height:1.8; }
.poster-detail-focus { margin:24px 0 0; color:var(--muted); font:10px/1.8 var(--font-mono); }
.poster-lightbox[open] .poster-lightbox-stage { animation:poster-expand .36s cubic-bezier(.2,.7,.2,1) both; }
.poster-lightbox[open] .poster-lightbox-details { animation:poster-details-in .46s .3s cubic-bezier(.2,.7,.2,1) both; }
@keyframes poster-expand { from { opacity:0; transform:translateY(14px) scale(.96); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes poster-details-in { from { opacity:0; transform:translateX(24px); } to { opacity:1; transform:translateX(0); } }
.poster-project :is(a,button):focus-visible,.poster-lightbox button:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
@media(max-width:800px) {
  .poster-lightbox[open] { display:block; overflow-y:auto; }
  .poster-lightbox { padding:70px 22px 28px; }
  .poster-lightbox-layout { grid-template-columns:1fr; gap:26px; }
  .poster-lightbox-stage { height:min(70dvh,640px); }
  .poster-lightbox img { max-height:calc(min(70dvh,640px) - 64px); }
  .poster-lightbox-details { max-height:none; overflow:visible; padding:26px; }
}
@media(max-width:1000px) {
  .poster-heading { grid-template-columns:1fr; gap:30px; padding:55px 0 60px; }
  .poster-heading p { max-width:520px; }
  .poster-controls { grid-template-columns:1fr; gap:24px; }
  .poster-project-card[data-span] { grid-column:span 6; }
}
@media(max-width:650px) {
  .poster-project { --poster-stage-height:340px; padding:88px 20px 32px; }
  .poster-intro-bar { padding:13px 15px; font-size:9px; gap:12px; }
  .poster-intro-bar > span { max-width:170px; letter-spacing:.04em; }
  .poster-heading { padding:42px 0 45px; }
  .poster-heading h1 { font-size:clamp(56px,12vw,78px); }
  .poster-heading p { font-size:17px; }
  .poster-filters { gap:7px; }
  .poster-filters button { padding:10px 12px; font-size:11px; }
  .poster-countline { padding-top:26px; }
  .poster-countline h2,.poster-countline p { font-size:10px; }
  .poster-projects { gap:15px; }
  .poster-project-card[data-span] { grid-column:span 12; }
  .poster-visual { border-radius:18px; }
  .poster-stack { padding:26px; }
  .poster-stack img { max-height:calc(var(--poster-stage-height) - 52px); }
  .poster-project-meta { padding-bottom:20px; }
  .poster-project-meta h2 { font-size:22px; }
  .poster-footer { flex-direction:column; align-items:start; gap:30px; padding:35px 25px; margin-top:35px; border-radius:18px; }
}
@media(prefers-reduced-motion:reduce) { .poster-stack img,.poster-filters button { transition:none; } .poster-lightbox[open] .poster-lightbox-stage,.poster-lightbox[open] .poster-lightbox-details { animation:none; } }
