.comm-page{--comm-amber:#ffb500}
.comm-page .comm-hero{min-height:65svh;background:#121212}
.comm-page .comm-hero h1{max-width:1100px}
.comm-page .comm-hero .portfolio-intro{max-width:780px}
.comm-page .comm-hero .portfolio-intro p{max-width:630px}
.comm-gallery-section{display:grid;grid-template-columns:minmax(190px,3fr) minmax(0,9fr);gap:5.5vw;padding-top:96px;padding-bottom:100px;border-bottom:1px solid #303030}
.comm-gallery-section.is-revealed{animation:comm-section-reveal .62s cubic-bezier(.2,.7,.2,1) both}
@keyframes comm-section-reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.comm-section-intro{position:sticky;top:112px;align-self:start;max-width:300px}
.comm-section-intro .eyebrow{margin:0 0 18px;color:#b99742;font-size:.56rem;letter-spacing:.09em}
.comm-section-intro h2{margin:0 0 17px;color:#f3f3f3;font-size:clamp(2rem,3.3vw,3.6rem);font-weight:500;line-height:.96;letter-spacing:-.075em}
.comm-section-intro>p:last-child{margin:0;color:#a8a8a8;font-size:.9rem;line-height:1.65}
.comm-gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;gap:clamp(12px,1.5vw,22px)}
.comm-span-4{grid-column:span 4}.comm-span-5{grid-column:span 5}.comm-span-6{grid-column:span 6}.comm-span-7{grid-column:span 7}.comm-span-8{grid-column:span 8}.comm-span-12{grid-column:span 12}
.comm-art{min-width:0;margin:0;transition:transform .3s ease}
.comm-art-link{display:flex;justify-content:center;align-items:center;width:100%;padding:clamp(12px,1.65vw,22px);overflow:hidden;background:#202020;transition:background-color .25s ease}
.comm-art-link img{display:block;width:100%;max-width:var(--art-max,100%);height:auto;object-fit:contain}
.comm-art:hover{transform:translateY(-3px)}
.comm-art:hover .comm-art-link{background-color:#292929}
.comm-art--neutral .comm-art-link{background:#e6e5e0}
.comm-art--neutral:hover .comm-art-link{background:#f0efea}
.comm-art--poster .comm-art-link{padding:clamp(16px,2vw,28px);background:#1b1b1b}
.comm-art--editorial .comm-art-link{padding:clamp(8px,1vw,14px);background:#242321}
.comm-art figcaption{display:flex;flex-direction:column;gap:4px;padding:11px 2px 0}
.comm-art figcaption span{color:#e7e7e7;font-size:.8rem;line-height:1.3}
.comm-art figcaption small{color:#8f8f8f;font:.54rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.comm-related-group{min-width:0;padding:8px 0 4px}
.comm-related-label{margin:0 0 13px;color:#9b9b9b;font-size:.55rem;letter-spacing:.09em}
.comm-related-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:clamp(10px,1.3vw,18px)}
.comm-lightbox{position:fixed;inset:0;width:min(96vw,1500px);height:min(94vh,1100px);max-width:none;max-height:none;margin:auto;padding:22px 84px 26px;border:1px solid #454545;border-radius:3px;background:#111f;color:#fff;grid-template-rows:auto minmax(0,1fr);align-items:center;justify-items:center}
.comm-lightbox[open]{display:grid}
.comm-lightbox::backdrop{background:rgb(0 0 0 / .88);backdrop-filter:blur(4px)}
.comm-lightbox-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:42px;margin-bottom:12px}
.comm-lightbox-caption{display:flex;flex-direction:column;gap:4px}
.comm-lightbox-caption strong{font-size:.9rem;font-weight:500}
.comm-lightbox-caption span{color:#999;font:.55rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.comm-lightbox-close,.comm-lightbox-nav{display:grid;place-items:center;width:46px;height:46px;border:1px solid #646464;border-radius:50%;background:#171717;color:#fff;font:1.45rem/1 var(--display);cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.comm-lightbox-close:hover,.comm-lightbox-nav:hover{border-color:var(--comm-amber);background:#222;color:var(--comm-amber)}
.comm-lightbox-image{display:block;width:100%;height:100%;min-height:0;object-fit:contain}
.comm-lightbox-nav{position:absolute;z-index:2;top:50%;transform:translateY(-50%)}
.comm-lightbox-prev{left:20px}.comm-lightbox-next{right:20px}
@media(max-width:960px){
  .comm-gallery-section{grid-template-columns:1fr;gap:28px;padding-top:72px;padding-bottom:76px}
  .comm-section-intro{position:static;max-width:700px}
  .comm-section-intro h2{font-size:clamp(2.1rem,5vw,3.4rem)}
  .comm-gallery{grid-template-columns:repeat(12,minmax(0,1fr))}
}
@media(max-width:640px){
  .comm-page .comm-hero{min-height:58svh}
  .comm-gallery-section{gap:23px;padding-top:56px;padding-bottom:62px}
  .comm-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .comm-gallery>.comm-span-4,.comm-gallery>.comm-span-5,.comm-gallery>.comm-span-6{grid-column:span 1}
  .comm-gallery>.comm-span-7,.comm-gallery>.comm-span-8,.comm-gallery>.comm-span-12{grid-column:span 2}
  .comm-related-group{grid-column:span 2}
  .comm-related-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
  .comm-related-gallery .comm-art:last-child:nth-child(odd){grid-column:1/-1}
  .comm-art-link,.comm-art--poster .comm-art-link{padding:12px}
  .comm-art figcaption{padding-top:8px}
  .comm-art figcaption span{font-size:.74rem}
  .comm-art figcaption small{font-size:.48rem}
  .comm-lightbox{width:100vw;height:100dvh;max-height:100dvh;padding:18px 12px 20px;border:0;border-radius:0}
  .comm-lightbox-top{padding:0 52px 0 4px}
  .comm-lightbox-close{position:absolute;top:0;right:0;width:42px;height:42px}
  .comm-lightbox-nav{top:auto;bottom:18px;width:48px;height:48px;transform:none}
  .comm-lightbox-prev{left:calc(50% - 60px)}
  .comm-lightbox-next{right:calc(50% - 60px)}
  .comm-lightbox-image{height:calc(100% - 80px);align-self:start}
}
@media(max-width:420px){
  .comm-gallery{grid-template-columns:1fr}
  .comm-gallery>.comm-span-4,.comm-gallery>.comm-span-5,.comm-gallery>.comm-span-6,.comm-gallery>.comm-span-7,.comm-gallery>.comm-span-8,.comm-gallery>.comm-span-12,.comm-related-group{grid-column:1}
  .comm-related-gallery{grid-template-columns:1fr}
  .comm-related-gallery .comm-art:last-child:nth-child(odd){grid-column:1}
}
@media(prefers-reduced-motion:reduce){
  .comm-art,.comm-art-link,.comm-lightbox-close,.comm-lightbox-nav{transition:none}
  .comm-gallery-section.is-revealed{animation:none}
  html:has(.comm-page){scroll-behavior:auto}
}