/* UCMF — static composer & festival-edition pages (generated by gen_seo.py) */
.sr-only{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.cp{ padding: 0 var(--edge) 90px; max-width: calc(var(--max-width) + 2 * var(--edge)); }
.cp-grid{ margin-top: 40px; display:grid; grid-template-columns: minmax(0,320px) minmax(0,1fr); gap: 48px; align-items:start; margin-bottom: 24px; }
.cp-grid:not(:has(.cp-photo)){ grid-template-columns: minmax(0,1fr); }
.cp-photo{ margin:0; aspect-ratio: 4 / 5; overflow:hidden; background:#f3f1ea; }
.cp-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.cp-body{ max-width: 760px; }
.cp-bio{ font-size: clamp(18px, 1.5vw, 22px); line-height: 1.4; letter-spacing: -0.015em; }
.cp-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top: 22px; }
.cp-h2{ font-family: var(--font-nav); font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
        color: var(--gray); margin: 56px 0 18px; padding-top: 18px; border-top: 1px solid var(--hairline); scroll-margin-top: 110px; }
.cp-body .cp-h2{ margin-top: 36px; }
.cp-list{ margin:0; padding-left: 1.1em; font-size: 17px; line-height: 1.5; }
.cp-work{ padding: 18px 0 22px; border-bottom: 1px solid #e4e0d5; max-width: 900px; }
.cp-work h3{ font-weight: 400; font-size: 24px; letter-spacing: -0.02em; margin: 0 0 6px; }
.cp-meta{ font-size: 14px; color: var(--gray); margin-bottom: 10px; }
.cp-meta a, .cp-line a, .cp-more a, .cp-azlist a, .cp-yt{ text-decoration: underline; text-underline-offset: 3px; }
.cp-note{ font-size: 15px; color: var(--gray); margin-bottom: 8px; }
.cp-desc{ font-size: 16px; line-height: 1.55; max-width: 72ch; margin: 10px 0; }
.cp-role{ color: var(--gray); }
.cp-yt{ font-size: 14px; color: var(--gray); }
.cp-line{ font-size: 18px; line-height: 1.45; padding: 10px 0; border-bottom: 1px solid #eee9de; max-width: 900px; }
.cp-more{ margin-top: 36px; font-size: 16px; }
.cp-azlist{ display:flex; flex-wrap:wrap; gap: 8px 22px; font-size: 16px; line-height: 1.5; }
.cp-az{ padding-top: 20px; }
@media (max-width: 760px){
  .cp-grid{ grid-template-columns: 1fr; gap: 24px; }
  .cp-photo{ max-width: 280px; }
  .cp{ padding-left: 20px; padding-right: 20px; }
}