/* One content grid across the portfolio. */
.project-database,.catalogue-grid{margin-left:24%;width:76%;max-width:none;margin-right:0}
.project-database,.catalogue-grid{margin-top:100px}
.error-content{margin-left:24%;width:76%}
.collection-bar{margin:100px 10% 0 24%;border-bottom:none}
.collection-drafts{margin:40px 10% 0 24%;font-size:13px;color:var(--pf-muted);line-height:1.6}
.collection-drafts .unavailable{text-decoration:line-through}
.collection-drafts .database-label{margin-right:8px}
.catalogue-grid{column-gap:40px;row-gap:60px}
.catalogue-grid figure:nth-child(2){padding-top:0}
.about-layout,.contact-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.database-bar{flex-wrap:wrap;align-items:center;gap:8px 20px;padding-bottom:12px}
.database-controls{align-items:center;gap:4px}
.database-controls button{min-height:44px;padding:0 8px}
.database-count{display:block;white-space:nowrap}
.process-list{padding:0;margin:0;list-style:none;counter-reset:step}
.process-list li{position:relative;margin-bottom:25px;padding-left:34px;counter-increment:step}
.process-list li::before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:0;color:var(--pf-muted);font-size:12px}
.process-list strong{display:block;font-weight:400;margin-bottom:8px}
.process-list p{color:var(--pf-muted);line-height:1.5;margin:0}
.terms-list{margin:0;display:grid;gap:20px}
.terms-list dt{margin-bottom:6px;text-transform:uppercase;font-size:12px;color:var(--pf-muted)}
.terms-list dd{margin:0;line-height:1.5}
.case-cover{width:100%}
.case-more .mobile-pair{display:grid;grid-template-columns:1fr 1fr;gap:30px;background:var(--pf-soft);padding:35px;margin-bottom:50px}
.case-more .mobile-pair figure{margin:0}
.case-more .mobile-pair img{max-width:280px;margin:auto}
.preview-banner{background:#fff6ca;border:1px solid #c3a438;padding:12px 20px;color:#333;line-height:1.5}
.portfolio>.preview-banner{margin:0 27px}
/* Short pages keep the footer at the bottom of the viewport.
   The shared width rule sets margin:auto, so vertical margins are reset here. */
.portfolio{display:flex;flex-direction:column;min-height:100vh}
.portfolio>.site-header,.portfolio>.shell{margin-top:0;margin-bottom:0}
.portfolio>.site-footer{margin-top:auto;margin-bottom:0}
/* A single published work fills the column instead of leaving half the grid empty,
   and the gaps sized for a multi-row grid shrink to match. */
.catalogue-grid:has(figure:only-child){grid-template-columns:minmax(0,1fr);margin-top:55px}
.collection:has(.catalogue-grid figure:only-child) .collection-bar{margin-top:60px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.about-layout>*,.contact-layout>*,.catalogue-grid>*,.case-sidebar{min-width:0}
.case-data dd,.body-copy,.about-statement,.case-context p,.index-header p,.contact-layout p{overflow-wrap:anywhere}
@media(max-width:1000px){.project-database,.catalogue-grid,.error-content{margin-left:0;width:100%}.case-layout{grid-template-columns:minmax(0,35fr) minmax(0,62.8fr)}}
@media(max-width:760px){.project-database,.catalogue-grid{margin-top:50px}.collection-bar,.collection-drafts{margin-left:0;margin-right:0}.collection-bar{margin-top:50px}.catalogue-grid{grid-template-columns:1fr}.case-layout{grid-template-columns:minmax(0,1fr)}.about-layout,.contact-layout{grid-template-columns:minmax(0,1fr)}.database-bar{gap:6px}.database-controls{gap:4px 6px}.case-more .mobile-pair{gap:20px;padding:20px}.portfolio>.preview-banner{margin:0 20px}.database-count{font-size:12px}}