.communis-page { color: var(--red); background: #fff; }
.communis-header { position: relative; z-index: 2; background: #fff; padding: 32px var(--grid-right) 0 var(--grid-left); }
.communis-header .work-detail-logo { width: clamp(95px, 9vw, 172px); }
.communis-layout { position: relative; z-index: 2; background: #fff; display: grid; grid-template-columns: minmax(0,828fr) minmax(0,972fr); gap: max(16px,1.048vw); padding: clamp(56px,6vw,114px) var(--grid-right) 72px var(--grid-left); }
.communis-intro { position: sticky; top: 24px; align-self: start; min-width: 0; }
.communis-reading-header { margin-bottom: 24px; }
.communis-reading-header .work-back-link { display: table; }
.communis-reading {
 min-width: 0; max-height: calc(100svh - 96px); overflow-y: auto;
 overscroll-behavior-y: contain; scrollbar-width: none;
 border-top: 1px solid currentColor; padding-bottom: 32px;
}
.communis-reading::-webkit-scrollbar { display: none; }
.communis-reading:focus-visible { outline: 1px solid currentColor; outline-offset: 4px; }
.communis-intro h1 { font-size: var(--editorial-heading); line-height: 1.05; margin: 32px 0; }
.communis-intro .communis-kicker { font-size: var(--editorial-micro); margin-top: 10px; }
.communis-story { max-width: 42ch; font-size: var(--editorial-small); line-height: 1.25; }
.communis-story p { margin: 0 0 24px; }
.communis-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 18px; margin: 28px 0 0; padding-top: 20px; border-top: 1px solid currentColor; font-size: var(--editorial-micro); line-height: 1.25; }
.communis-meta div:nth-child(n+3) { grid-column: 1 / -1; }
.communis-meta dt { margin: 0 0 6px; font-weight: 700; text-transform: uppercase; }
.communis-meta dd { margin: 0; }
.communis-board { display: grid; align-content: start; gap: 32px; min-width: 0; }
@media (min-width:601px) {
 .communis-board { margin-top: calc(-1 * var(--communis-media-offset, 0px)); }
}
.communis-board figure { margin: 0; }
.communis-board .work-detail-media { aspect-ratio: auto; background: transparent; }
.communis-board .work-detail-media img { height: auto; object-fit: contain; }
.communis-board img { display: block; width: 100%; height: auto; }
.communis-board video { display: block; width: 100%; height: auto; aspect-ratio: 16/9; background: #000; }
.communis-ribbon { position: relative; z-index: 2; background: var(--red); overflow: hidden; cursor: grab; touch-action: pan-y; user-select: none; padding: 32px 0; }
.communis-ribbon.is-dragging { cursor: grabbing; }
.communis-ribbon:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
.communis-ribbon-track { display: flex; width: max-content; will-change: transform; }
.communis-ribbon-set { display: flex; flex-shrink: 0; gap: 12px; padding-right: 12px; }
.communis-ribbon figure { margin: 0; flex: none; height: clamp(280px,29vw,550px); transform: rotate(var(--poster-tilt,0deg)); transform-origin: center 65%; }
.communis-ribbon img { display: block; height: 100%; width: auto; max-width: none; pointer-events: none; }
.communis-ribbon .ribbon-help { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.communis-shop { position: relative; z-index: 2; background: var(--red); color: #fff; display: grid; grid-template-columns: minmax(0,828fr) minmax(0,972fr); gap: max(16px,1.048vw); padding: 64px var(--grid-right) 80px var(--grid-left); }
.communis-shop-copy { display: flex; flex-direction: column; align-items: start; padding-top: 32px; border-top: 1px solid #fff; align-self: center; }
.communis-shop h2 { font-size: var(--editorial-heading); line-height: 1.05; margin: 0 0 28px; white-space: nowrap; }
.communis-shop p { font-size: var(--editorial-small); line-height: 1.25; max-width: 40ch; margin: 0 0 32px; }
.communis-shop .editorial-link { align-self: flex-end; }
.communis-product { display: block; color: #fff; position: relative; width: min(100%,650px); aspect-ratio: 1; justify-self: center; }
.communis-product::before { content: ''; position: absolute; inset: 5%; border-radius: 50%; background: #c2c2c2; }
.communis-product > img { position: absolute; width: 90%; height: 90%; object-fit: contain; top: 5%; left: 5%; padding: 3.6%; transition: opacity .35s ease; }
.communis-product-alternate { opacity: 0; }
.communis-product:focus-visible .communis-product-front { opacity: 0; }
.communis-product:focus-visible .communis-product-alternate { opacity: 1; }
@media (hover: hover) and (pointer: fine) {
 .communis-product:hover .communis-product-front { opacity: 0; }
 .communis-product:hover .communis-product-alternate { opacity: 1; }
}
.communis-product svg { width: 100%; height: 100%; fill: currentColor; font-size: 12px; letter-spacing: 3px; animation: communis-orbit 32s linear infinite; }
.communis-product:hover svg,.communis-product:focus svg { animation-play-state: paused; }
@keyframes communis-orbit { to { transform: rotate(360deg); } }
.communis-page .detail-outro { padding-top: 0; }
.communis-page .detail-outro-copy { border-top: 1px solid #fff; padding-top: 64px; }
@media (min-width:601px) and (max-width:760px) {
 .communis-shop h2 { font-size: 34px; }
}
@media(max-width:600px) {
 .communis-layout,.communis-shop { grid-template-columns: minmax(0,1fr); gap: 40px; }
 .communis-layout { padding-top: 40px; padding-bottom: 48px; }
 .communis-story { max-width: none; }
 .communis-intro { position: relative; top: auto; }
 .communis-reading { max-height: none; overflow: visible; padding-bottom: 0; }
 .communis-board { gap: 16px; padding-top: 0; }
 .communis-ribbon { padding: 24px 0; }
 .communis-ribbon figure { height: 360px; }
 .communis-shop { padding-top: 48px; padding-bottom: 48px; }
 .communis-product { max-width: 450px; }
}
@media(prefers-reduced-motion:reduce) { .communis-product svg { animation: none; } .communis-product > img { transition: none; } }

.communis-reading > .work-mobile-opening { display: block; width: 100%; height: auto; aspect-ratio: 16/9; margin: 0 0 32px; }