/* Twelve equal columns, shared with the full-width presentation below. */
html #projects-inner details.project > .project-body > .wl-case-intro {
  display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:24px;row-gap:0;grid-column:1/-1;box-sizing:border-box;
  position:relative;width:100%!important;max-width:none!important;min-width:0;
  margin:0 0 8px!important;padding:20px 0 0!important;border:0;background:none;
  color:var(--ink,#202020);text-align:start;direction:inherit;
  font:400 14px/1.6 var(--sans,Arial,sans-serif);letter-spacing:0;
}
html #projects-inner .wl-case-intro > .wl-ci-title {
  grid-column:1/4;margin:0!important;padding:0!important;max-width:22ch;
  font:500 clamp(22px,1.6vw,24px)/1.25 var(--sans,Arial,sans-serif)!important;
  color:var(--ink,#202020)!important;letter-spacing:-.015em!important;
  text-transform:none!important;text-wrap:balance;overflow-wrap:break-word;
}
html #projects-inner .wl-case-intro > .wl-ci-copy {grid-column:4/-1;min-width:0;max-width:76ch;}
html #projects-inner .wl-case-intro .wl-ci-copy > p {
  margin:0;padding:0;color:var(--ink,#202020);text-wrap:pretty;overflow-wrap:break-word;
  font:400 13px/1.55 var(--sans,Arial,sans-serif);letter-spacing:0;
}
html #projects-inner .wl-case-intro .wl-ci-copy > .wl-ci-description {
  max-width:60ch;font:400 18px/1.5 var(--sans,Arial,sans-serif);margin:0 0 12px;
}
html #projects-inner .wl-case-intro .wl-ci-copy > :is(.wl-ci-meta,.wl-ci-credit,.wl-ci-note) {
  margin-top:12px;color:var(--muted,#626262);font-size:13px;line-height:1.55;
}
html #projects-inner .wl-case-intro .wl-ci-copy > .wl-ci-credit {color:var(--ink,#202020);}
html #projects-inner .wl-case-intro .wl-ci-task {display:inline-block;max-width:100%;vertical-align:top;}
/* Legacy captions remain available to their existing mount code, outside the visual/AX tree. */
html #projects-inner [data-intro-managed] :is(.wl-project-caption,.nimer-case-credit,.nimer-case-scope,.wi-project-lead,.ze-project-lead,.cs-project-credit,.teaser-copy,.archive-intro,.wi-case-intro,.cs-intro,.naglos-opening,.dc-opening,.metamorphosis-summary h4,.metamorphosis-lead,.metamorphosis-facts) {display:none!important;}
html #projects-inner [data-intro-managed] > .wl-case-intro {display:grid!important;}
html #projects-inner [data-intro-managed] > .teaser-layout {display:block!important;}
html #projects-inner [data-intro-managed] > .teaser-layout > .teaser-art {max-width:900px;margin-inline:auto;}
@media(max-width:800px) {
  html #projects-inner details.project > .project-body > .wl-case-intro {column-gap:16px;row-gap:16px;margin-bottom:8px!important;}
  html #projects-inner .wl-case-intro > .wl-ci-title {grid-column:1/5;}
  html #projects-inner .wl-case-intro > .wl-ci-copy {grid-column:5/-1;}
}
@media(max-width:600px) {
  html #projects-inner details.project > .project-body > .wl-case-intro {grid-template-columns:minmax(0,1fr);gap:14px;margin-bottom:4px!important;padding-top:18px!important;}
  html #projects-inner .wl-case-intro > :is(.wl-ci-title,.wl-ci-copy) {grid-column:1;max-width:100%;}
  html #projects-inner .wl-case-intro .wl-ci-copy > .wl-ci-description {font-size:17px;line-height:1.5;}
}
/* Pushback opens at the same full presentation width as the other case studies. */
html #projects-inner #case-pushback [data-intro-managed] > .teaser-layout > .teaser-art{width:100%;max-width:none;margin-inline:0}

/* A consistent pause between the introduction and the presentation. */
html body #projects-inner details.project > .project-body[data-intro-managed] > .wl-case-intro {
  margin-bottom:24px!important;
}
@media(max-width:600px) {
  html body #projects-inner details.project > .project-body[data-intro-managed] > .wl-case-intro {
    margin-bottom:18px!important;
  }
}

/* One outside rhythm for all presentations; their inner layouts stay independent. */
html #projects-inner details.project > .project-body[data-intro-managed] {
  padding:24px 0 40px!important;
  margin:0!important;
}
html #projects-inner #case-cisco > .project-body[data-intro-managed] {padding-bottom:40px!important;}
html #projects-inner details.project > .project-body[data-intro-managed] > .wl-case-footer {
  margin-top:40px!important;
}
html #projects-inner :is(#case-racionz,#case-gideon) [data-intro-managed] > .teaser-layout > .teaser-art {
  width:100%;max-width:none;margin-inline:0;
}

/* The project hero is a fluid composition; the portfolio thumbnail keeps its own scale. */
@media(min-width:1600px) {
html #projects-inner #case-pushback .pb-teaser-preview .pb-sheet {
  width:100%;height:100%;transform:none!important;
}
html #projects-inner #case-pushback .pb-teaser-preview .pb-masthead {
  top:8%;font-size:clamp(100px,20.8vw,300px);
}
html #projects-inner #case-pushback .pb-teaser-preview .pb-bottom-grid {top:51%;}
}

@media(max-width:600px) {
  html #projects-inner details.project > .project-body[data-intro-managed] {padding:16px 0 32px!important;}
  html #projects-inner #case-cisco > .project-body[data-intro-managed] {padding-bottom:32px!important;}
  html #projects-inner details.project > .project-body[data-intro-managed] > .wl-case-footer {margin-top:32px!important;}
  html #projects-inner #case-pushback .pb-teaser-preview {aspect-ratio:auto;height:auto;}
  html #projects-inner #case-pushback .pb-teaser-preview .pb-cover {height:auto;}
  html #projects-inner #case-pushback .pb-teaser-preview .pb-sheet {
    position:relative;inset:auto;width:100%;height:auto;padding:24px;transform:none!important;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-masthead {
    position:relative;inset:auto;font-size:clamp(46px,17vw,94px);line-height:.94;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-bottom-grid {
    position:relative;inset:auto;display:grid;grid-template-columns:minmax(0,1fr) 84px;
    gap:12px 16px;margin-top:28px;align-items:start;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-author {
    grid-column:1;padding:0;font-size:14px;line-height:1.35;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-author span {
    margin-top:2px;font-size:16px;line-height:1.35;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-subtitle {
    grid-column:1;font-size:20px;line-height:1.25;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-book-edition {
    grid-column:2;grid-row:1 / span 2;gap:4px;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-book {
    width:84px!important;height:105px!important;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-book-edition figcaption {
    font-size:9px;line-height:1.2;letter-spacing:.03em;
  }
  html #projects-inner #case-pushback .pb-teaser-preview .pb-footline {
    position:relative;inset:auto;gap:12px;margin-top:28px;padding-top:12px;
    border-top-width:1px;font-size:9px;line-height:1.4;letter-spacing:.04em;
  }
}