/* The name is the work's navigation. Logos are authentic, optional punctuation. */
.studio-projects,.studio-process{padding-block:var(--se-section-space);min-width:0}
.studio-section-top{display:grid;grid-template-columns:var(--se-header-columns);gap:var(--space-6) var(--space-12);margin-bottom:var(--space-12);align-items:end}
.studio-section-top .eyebrow{margin-bottom:var(--space-6)}
.studio-section-top h2{font-size:var(--se-header-title);line-height:var(--leading-title);letter-spacing:var(--tracking-display);font-weight:var(--weight-medium)}
.studio-section-top>p{max-width:var(--se-header-measure);justify-self:end;color:var(--muted)}
.studio-project-list{list-style:none;padding:0;margin:0;border-bottom:var(--hairline) solid var(--line)}
.studio-project-row{display:grid;grid-template-columns:var(--se-project-columns);align-items:center;gap:var(--space-3);padding-block:var(--se-project-pad);min-height:var(--se-project-min-height);border-top:var(--hairline) solid var(--line);color:var(--ink);text-decoration:none;position:relative}
.studio-project-index{align-self:center;color:var(--muted)}
.studio-project-title{margin:0;justify-self:center;max-width:100%;min-width:0;font-size:var(--se-project-type);font-weight:var(--weight-medium);line-height:var(--se-project-leading);letter-spacing:var(--se-project-tracking)}
.studio-project-title-visual{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
.studio-project-word{display:inline-block;transition:transform var(--se-motion-time) var(--se-motion-ease),color var(--se-motion-time) var(--se-motion-ease)}
.studio-project-word--before{transform:translateX(calc((1 - var(--se-project-open)) * var(--se-project-window) / 2))}
.studio-project-word--after{transform:translateX(calc((var(--se-project-open) - 1) * var(--se-project-window) / 2))}
.studio-project-window{flex:none;display:flex;align-items:center;justify-content:center;width:var(--se-project-window);height:var(--se-project-window-height);clip-path:inset(0 calc((1 - var(--se-project-open)) * 50%));opacity:var(--se-project-open);transition:clip-path var(--se-motion-time) var(--se-motion-ease),opacity var(--se-motion-time) var(--se-motion-ease);pointer-events:none}
.studio-project-window>img{display:block;width:var(--se-project-image-width);height:var(--se-project-image-height);object-fit:contain;transform:rotate(calc((1 - var(--se-project-open)) * var(--se-project-window-turn)));transition:transform var(--se-motion-time) var(--se-motion-ease)}
.studio-project-detail{display:flex;flex-direction:column;align-items:end;gap:var(--se-project-caption-gap);text-align:right;font-size:var(--text-small);color:var(--muted)}
.studio-project-detail>span:first-child{max-width:var(--se-project-caption-measure)}
.studio-project-arrow{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--ink)}
.studio-project-arrow>span:last-child{font-size:var(--se-project-arrow-size);transition:transform var(--se-motion-time) var(--se-motion-ease)}
.studio-project-row:focus-visible{outline-offset:var(--se-focus-inset)}
.studio-project-row:is(:hover,:focus-visible) .studio-project-arrow>span:last-child{transform:translate(var(--se-project-arrow-travel),calc(-1 * var(--se-project-arrow-travel)))}
.studio-project-row:is(:hover,:focus-visible) .studio-project-title{color:var(--accent)}
.studio-projects.is-editorial-ready .studio-project-row{--se-project-open:var(--se-project-rest)}
.studio-projects.is-editorial-ready .studio-project-row:is(:hover,:focus-visible){--se-project-open:1}
.studio-projects.is-editorial-paused .studio-project-row{--se-project-open:1!important}
.studio-projects.is-editorial-paused .studio-project-row *{transition:none!important}
.studio-projects .edition-foot{border:0}
.studio-process{border-top:var(--hairline) solid var(--line)}
.studio-process .studio-section-top h2{font-size:var(--se-process-heading)}
.studio-process .studio-section-top h2>span{color:var(--accent)}
.studio-process-list{list-style:none;margin:0;padding:0;border-bottom:var(--hairline) solid var(--line)}
.studio-process-step{display:grid;grid-template-columns:var(--se-process-columns);gap:var(--space-3) var(--se-process-gap);align-items:center;position:relative;padding-block:var(--se-process-pad);border-top:var(--hairline) solid var(--line)}
.studio-process-index{align-self:start;padding-top:var(--se-process-index-offset);color:var(--muted)}
.studio-process-step h3{font-size:var(--se-process-type);line-height:var(--leading-title);letter-spacing:var(--tracking-display);font-weight:var(--weight-medium);margin:0;min-width:0}
.studio-process-step:nth-child(even) h3{padding-left:var(--se-process-indent)}
.studio-process-step h3>span:first-child{display:inline-block;transform:translateX(calc((var(--se-process-progress) - .5) * var(--se-process-translation)));transition:transform var(--se-motion-time) var(--se-motion-ease)}
.studio-process-step.is-current h3>span:first-child,.studio-process-step:hover h3>span:first-child{color:var(--accent)}
.studio-process-symbol{display:inline-block;font-size:var(--se-process-symbol);margin-left:var(--se-process-symbol-gap);vertical-align:middle;color:var(--accent);transform:rotate(calc((var(--se-process-progress) - .5) * var(--se-process-turn)));transition:transform var(--se-motion-time) var(--se-motion-ease);pointer-events:none}
.studio-process-step p{color:var(--muted);max-width:var(--se-process-copy);margin:0}
.studio-process.is-editorial-paused .studio-process-step h3>span{transform:none;transition:none}
@media (max-width:720px){
  .studio-section-top{margin-bottom:var(--space-8)}
  .studio-section-top>p{justify-self:start}
  .studio-project-row{row-gap:var(--space-4)}
  .studio-project-title{justify-self:start}
  .studio-project-detail{grid-column:2;flex-direction:row;align-items:center;justify-content:space-between;text-align:left}
  .studio-project-index{align-self:start;padding-top:var(--space-2)}
  .studio-projects.is-editorial-ready .studio-project-row{--se-project-open:var(--se-project-mobile-rest)}
  .studio-process-step p{grid-column:2}
  .studio-process-step:nth-child(even) h3{padding-left:0}
}
@media (prefers-reduced-motion:reduce){
  .studio-projects.is-editorial-ready .studio-project-row{--se-project-open:1!important}
  .studio-project-window,.studio-project-word,.studio-project-window>img,.studio-project-arrow>span:last-child,.studio-process-step h3>span{transition:none;transform:none}
}
/* One selected project, whether found by scrolling, hovering or the keyboard. */
.studio-projects.is-editorial-ready .studio-project-row .studio-project-title { color: var(--ink); }
.studio-projects.is-editorial-ready .studio-project-row.is-centred .studio-project-title { color: var(--accent); }
