/* A continuous black editorial stage. Photo sizes and offsets are authored
   here; the sculpture measures these native DOM bounds before projecting. */
.collaboration-index {
  --ci-ground:#050505;
  --ci-ink:#fff;
  --ci-muted:#b8b8b8;
  --ci-line:#353535;
  --ci-edge:clamp(20px,4vw,76px);
  --ci-content-max:1600px;
  --ci-opening:clamp(260px,24.4vw,390px);
  --ci-client-left:28.3%;
  --ci-client-center:32.9%;
  --ci-client-right:24.1%;
  --ci-center-offset:clamp(-26px,-1.65vw,-14px);
  --ci-right-offset:clamp(-20px,-1.3vw,-10px);
  --ci-publication-width:54%;
  --ci-publication-gap:clamp(48px,4.5vw,72px);
  --ci-ease:cubic-bezier(.16,1,.3,1);
  position:relative;
  isolation:isolate;
  overflow:clip;
  padding:max(clamp(72px,6.8vw,110px),calc(clamp(72px,10.7svh,108px) + 12px)) var(--ci-edge) 28px;
  color:var(--ci-ink);
  background:var(--ci-ground);
  scroll-margin-top:var(--header-clearance);
}
.collaboration-index ::selection { background:var(--ci-ink); color:var(--ci-ground); }
.collaboration-index a:focus-visible { outline:1px solid var(--ci-ink); outline-offset:8px; }
.ci-heading,.ci-scene,.ci-footer { max-width:var(--ci-content-max); margin-inline:auto; }
.ci-heading { position:relative; min-height:var(--ci-opening); padding-bottom:32px; }
.editorial-home .ci-title {
  position:relative; z-index:3; width:max-content; margin:0;
  transform:scaleX(1.27); transform-origin:0 0;
  font:700 clamp(76px,8.5vw,142px)/.88 'Archivo Hero',var(--sans);
  letter-spacing:-.035em; text-transform:none; font-synthesis:none;
}
.ci-heading > p {
  position:relative; z-index:3; width:fit-content; margin:26px 0 0;
  padding:0 0 0 17px; border-left:1px solid #777;
  font:500 clamp(11px,1.12vw,17px)/1.5 var(--sans);
  letter-spacing:.15em; text-transform:uppercase; color:var(--ci-ink);
}
/* One viewport-sized canvas travels inside the whole section. The physical
   photo occluders are coordinated by clients-chrome, not separate canvases. */
.ci-chrome { position:absolute; z-index:2; inset:0; pointer-events:none; }
.ci-chrome__canvas { position:sticky; top:0; display:block; width:100%; height:100svh; opacity:0; }
.ci-chrome-ready .ci-chrome__canvas { opacity:1; }
.ci-group { position:relative; }
.ci-group__list { list-style:none; margin:0; padding:0; }
.editorial-home .ci-group__label {
  position:relative; z-index:3; display:flex; width:fit-content; align-items:center; gap:22px;
  margin:0 0 24px; font:500 11px/1.5 var(--sans);
  letter-spacing:.12em; text-transform:uppercase; color:var(--ci-ink);
}
.ci-group__label::after { content:''; display:block; width:44px; height:1px; background:var(--ci-line); }
.ci-group--clients .ci-group__list {
  display:grid; grid-template-columns:var(--ci-client-left) var(--ci-client-center) var(--ci-client-right);
  justify-content:space-between; align-items:start;
}
.ci-group--clients .ci-entry:nth-child(2) { margin-top:var(--ci-center-offset); }
.ci-group--clients .ci-entry:nth-child(3) { margin-top:var(--ci-right-offset); }
.ci-entry { min-width:0; }
.ci-project { display:block; }
.collaboration-index .ci-print { margin:0; }
.ci-print__surface { position:relative; z-index:1; display:block; overflow:clip; background:#0b0b0b; }
.ci-print__surface img { display:block; width:100%; height:auto; transition:transform 800ms var(--ci-ease); }
.ci-caption { position:relative; z-index:3; display:grid; gap:5px; padding:12px 25px 0 0; }
.ci-name { font:500 clamp(23px,2.35vw,40px)/1.02 var(--sans); letter-spacing:-.035em; text-transform:uppercase; }
.ci-caption > .ci-name,.ci-caption > .ci-project-title { width:fit-content; max-width:100%; }
.ci-project-title { font:500 clamp(11px,1.04vw,14px)/1.5 var(--sans); color:var(--ci-muted); }
.ci-caption svg { position:absolute; right:0; top:14px; width:20px; height:20px; transition:transform 350ms var(--ci-ease); }
.ci-group--publications { margin-top:var(--ci-publication-gap); }
.ci-group--publications .ci-group__label { position:absolute; top:18px; left:0; margin-bottom:0; }
.ci-group--publications .ci-print { display:grid; grid-template-columns:40% var(--ci-publication-width); justify-content:space-between; align-items:center; }
.ci-group--publications .ci-print__surface { grid-column:2; grid-row:1; }
.ci-group--publications .ci-caption { grid-column:1; grid-row:1; padding:0; align-content:center; gap:24px; }
.ci-group--publications .ci-name { width:max-content; max-width:8ch; transform:scaleX(1.16); transform-origin:0 50%; font:700 clamp(70px,8.1vw,136px)/.88 'Archivo Hero',var(--sans); letter-spacing:-.035em; }
.ci-group--publications .ci-project-title { font-size:13px; color:var(--ci-ink); }
.ci-group--publications .ci-caption svg { position:static; width:26px; height:26px; margin-top:0; }
.ci-footer { position:relative; z-index:3; display:flex; justify-content:flex-end; margin-top:24px; }
.ci-footer a { display:flex; align-items:center; gap:28px; min-height:44px; font:500 11px/1.5 var(--sans); letter-spacing:.12em; text-transform:uppercase; }
.ci-footer svg { width:18px; height:18px; transition:transform 350ms var(--ci-ease); }
@media (hover:hover) and (pointer:fine) {
  .ci-project:hover .ci-print__surface img { transform:scale(1.018); }
  .ci-project:hover .ci-caption svg,.ci-footer a:hover svg { transform:translate(3px,-3px); }
  .ci-project:hover .ci-name { color:#fff; }
}
.ci-project:focus-visible .ci-caption svg { transform:translate(3px,-3px); }
@media (max-width:1000px) and (min-width:701px) {
  .collaboration-index { --ci-opening:290px; --ci-publication-width:55%; --ci-publication-gap:64px; }
  .editorial-home .ci-title { width:max-content; font-size:clamp(72px,9vw,90px); }
  .ci-group--clients .ci-group__list { grid-template-columns:42% 46%; row-gap:46px; }
  .ci-group--clients .ci-entry:nth-child(2) { margin-top:84px; }
  .ci-group--clients .ci-entry:nth-child(3) { width:72%; margin:0 0 0 12%; }
  .ci-name { font-size:clamp(25px,3.4vw,34px); }
  .ci-group--publications .ci-print { grid-template-columns:40% var(--ci-publication-width); }
  .ci-group--publications .ci-name { font-size:clamp(62px,8vw,80px); }
}
@media (max-width:700px) {
  .collaboration-index {
    --ci-edge:5%; --ci-opening:260px; --ci-publication-gap:72px;
    padding-top:94px; padding-bottom:26px;
  }
  .editorial-home .ci-title { width:max-content; font-size:clamp(55px,14.9vw,98px); line-height:.9; }
  .ci-heading { padding-bottom:24px; }
  .ci-heading > p { margin-top:22px; padding-left:13px; font-size:10px; line-height:1.5; letter-spacing:.12em; }
  .editorial-home .ci-group__label { margin-bottom:24px; font-size:10px; gap:17px; }
  .ci-group__label::after { width:32px; }
  .ci-group--clients .ci-group__list { display:block; }
  .ci-group--clients .ci-entry { width:81%; margin:0 0 70px; }
  .ci-group--clients .ci-entry:nth-child(2) { width:87%; margin:0 0 72px auto; }
  .ci-group--clients .ci-entry:nth-child(3) { width:68%; margin:0 0 0 2%; }
  .ci-caption { gap:5px; padding-top:12px; }
  .ci-name { font-size:clamp(25px,7.2vw,42px); }
  .ci-project-title { font-size:11px; }
  .ci-caption svg { top:14px; width:18px; height:18px; }
  .ci-group--publications .ci-group__label { position:relative; top:auto; left:auto; margin-bottom:28px; }
  .ci-group--publications .ci-print { display:flex; flex-direction:column; align-items:stretch; }
  .ci-group--publications .ci-print__surface { width:92%; align-self:flex-end; }
  .ci-group--publications .ci-caption { padding:24px 32px 0 0; gap:13px; }
  .ci-group--publications .ci-name { max-width:8ch; font-size:clamp(62px,17vw,112px); line-height:.88; }
  .ci-group--publications .ci-project-title { font-size:11px; }
  .ci-group--publications .ci-caption svg { position:absolute; right:0; top:29px; width:24px; height:24px; margin:0; }
  .ci-footer { margin-top:38px; }
}
@media (prefers-reduced-motion:reduce) {
  .collaboration-index * { animation:none!important; transition:none!important; }
  .collaboration-index img,.collaboration-index svg { transform:none!important; }
}
