.dm-detail-preview {
  position: relative;
  z-index: 5;
  padding-top: var(--nav-h);
}
.dm-detail-preview__intro {
  padding-block: clamp(60px, 7vw, 116px) clamp(40px, 5vw, 80px);
}
.dm-detail-preview .dm-detail-preview__title {
  max-width: 16ch;
  margin: 0 0 clamp(40px, 6vw, 88px);
  font-size: clamp(42px, 6.3vw, 96px);
  line-height: 1.04;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.dm-detail-preview .dm-project-result,
.dm-detail-preview__text {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gutter);
  align-items: baseline;
}
.dm-detail-preview__facts {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
  gap: var(--gutter);
  margin: 0;
}
.dm-detail-preview__facts > div { min-width: 0; overflow-wrap: anywhere; }
.dm-detail-preview__fact--client { grid-column: 1 / span 4; }
.dm-detail-preview__fact--services { grid-column: 6 / span 4; }
.dm-detail-preview__fact--industry { grid-column: 10 / span 3; }
.dm-detail-preview__facts dt {
  margin-bottom: var(--s2, 16px);
  color: #676767;
  font: 400 12px/18px var(--fm);
  letter-spacing: var(--ls-u);
  text-transform: uppercase;
}
.dm-detail-preview__facts dd,
.dm-detail-preview .dm-project-result dd { margin: 0; }
.dm-detail-preview__facts dd {
  color: var(--ink);
  font: 500 12px/18px var(--fm);
  letter-spacing: 0;
  text-transform: uppercase;
}
.dm-detail-preview__facts dd .lnk {
  padding: 0;
  background: none;
  font: inherit;
  letter-spacing: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.dm-detail-preview__facts :is(.dm-detail-preview__service-list, .dm-detail-preview__industry-list) {
  list-style: none;
  margin: 0;
  padding: 0;
}
.dm-detail-preview__service-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
}
.dm-detail-preview__service-list > li { max-width: 100%; }
.dm-detail-preview__industry-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}
.dm-detail-preview .dm-showcase { margin: 0; }
.dm-detail-preview__balance:has(.dm-project-results--detail) {
  margin-block: clamp(56px, 8vw, 120px);
  padding-block: var(--s4, 32px);
  background: #fffde9;
}
.dm-detail-preview .dm-project-results--detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 4vw, 56px);
  margin: 0;
  padding: 0;
  background: transparent;
  max-width: none;
}
.dm-detail-preview .dm-project-result {
  grid-column: 1 / -1;
  margin: 0;
  min-width: 0;
}
.dm-detail-preview .dm-project-result > dt,
.dm-detail-preview__text > h2 { grid-column: 1 / 5; margin: 0; }
.dm-detail-preview .dm-project-result > dd,
.dm-detail-preview__copy {
  grid-column: 6 / -1;
  max-width: 62ch;
  overflow-wrap: anywhere;
}
.dm-detail-preview .dm-project-result__arrow { display: none; }
.dm-detail-preview__chapter + .dm-detail-preview__chapter,
.dm-detail-preview__end { margin-top: clamp(56px, 8vw, 120px); }
.dm-detail-preview__copy p { margin: 0; }
.dm-detail-preview__copy p + p { margin-top: var(--s3, 24px); }
.dm-detail-preview__text > h2 { text-wrap: balance; scroll-margin-top: calc(var(--nav-h) + 1rem); }
.dm-detail-preview__media {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--gutter);
  margin-top: var(--s5, 40px);
}
.dm-detail-preview__media + .dm-detail-preview__media { margin-top: var(--s4, 32px); }
.dm-detail-preview__media--pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dm-detail-preview__media figure,
.dm-detail-preview__lead figure { min-width: 0; }
.dm-detail-preview__end {
  display: grid;
  gap: var(--s4);
  padding-bottom: var(--s12);
}
.dm-detail-preview__end .dm-project-related > p + p { margin-top: var(--s1); }
.dm-detail-preview__nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2) var(--s4);
}
.dm-detail-preview .lnk {
  white-space: normal;
  max-width: 100%;
}
.dm-detail-preview :is(a, button):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 5px;
}
.dm-detail-preview button.lnk {
  appearance: none;
  border: 0;
  background-color: transparent;
  cursor: pointer;
  padding-inline: 0;
  text-align: start;
}
.dm-detail-preview .dm-detail-preview__motion { margin-top: var(--s1, 8px); }
@media (max-width: 767px) {
  .dm-detail-preview__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dm-detail-preview__facts > div { grid-column: auto; overflow-wrap: anywhere; }
  .dm-detail-preview__balance:has(.dm-project-results--detail) { padding-block: var(--s3, 24px); }
  .dm-detail-preview .dm-project-result,
  .dm-detail-preview__text { grid-template-columns: minmax(0, 1fr); gap: var(--s1, 8px); }
  .dm-detail-preview .dm-project-result > dd,
  .dm-detail-preview .dm-project-result > dt,
  .dm-detail-preview__text > h2,
  .dm-detail-preview__copy { grid-column: 1; }
  .dm-detail-preview__media--pair { grid-template-columns: minmax(0, 1fr); gap: var(--s4); }
}
@media (max-width: 420px) {
  .dm-detail-preview__facts { grid-template-columns: minmax(0, 1fr); gap: var(--s3); }
}
@media (prefers-reduced-motion: reduce) {
  .dm-detail-preview .lnk { transition: none; }
}

/* Keep each project's original composition after the shared introduction. */
.dm-detail-preview__existing > .dm-showcase { margin-block: 0 var(--s6); }
.dm-detail-preview__lead img { max-width: 100%; height: auto; }
.dm-detail-preview__summary,
.dm-detail-preview__existing .dm-portfolio-story { max-width: 64ch; margin: 0 0 var(--s6); }
.dm-detail-preview__lead + .dm-detail-preview__balance:not(:has(.dm-project-results)) + .dm-detail-preview__existing { margin-top: var(--s6); }
.dm-detail-preview .dm-ai-heading {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--gutter);
  align-items: baseline;
}
.dm-detail-preview .dm-ai-heading h2 { grid-column: 1 / 5; }
.dm-detail-preview .dm-ai-heading p { grid-column: 6 / -1; max-width: 62ch; }
@media (max-width: 767px) {
  .dm-detail-preview .dm-ai-heading { grid-template-columns: minmax(0, 1fr); }
  .dm-detail-preview .dm-ai-heading :is(h2,p) { grid-column: 1; }
}

.dm-detail-preview__text--heading-only > h2 { grid-column: 1 / span 8; }
.dm-detail-preview__balance:not(:has(.dm-project-results)) + .dm-detail-preview__chapter {
  margin-top: clamp(56px, 8vw, 120px);
}
.dm-detail-preview__chapter .dm-detail-preview__media > :is(figure, [class^="dm-layout-"], .wp-block-columns) { margin: 0; }
.dm-detail-preview__chapter .dm-detail-preview__media > * { min-width: 0; }
.dm-detail-preview__media img { max-width: 100%; height: auto; }
.dm-detail-preview__media--trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dm-detail-preview__media--banners { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* Plain assets fill their grid cell at their original proportions. Composed
   device screens, cropped details and editorial mockups keep their geometry. */
#inhalt.dm-detail-preview :is(.dm-original-stage, .dm-casebook-artwork):has(> img:only-child) {
  display: block;
  flex: none;
  height: auto;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
  padding: 0;
  background: transparent;
  overflow: visible;
}
#inhalt.dm-detail-preview :is(.dm-original-stage, .dm-casebook-artwork) > img:only-child {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}
.dm-detail-preview .dm-device-stage { background: transparent; }
.dm-detail-preview [data-project-layout="text-illus"] .dm-detail-preview__lead {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--gutter);
}
.dm-detail-preview [data-project-layout="text-illus"] .dm-detail-preview__lead > figure {
  grid-column: 4 / span 6;
  width: 100%;
  margin: 0;
}
@media (max-width: 767px) {
  .dm-detail-preview [data-project-layout="text-illus"] .dm-detail-preview__lead > figure {
    grid-column: 1 / -1;
  }
}
.dm-detail-preview [data-project-layout="text-illus"] .dm-detail-preview__lead img,
.dm-detail-preview [data-project-layout="text-illus"] .dm-detail-preview__media img {
  display: block;
  width: 100%;
}
.dm-detail-preview__extras { margin-top: clamp(56px, 8vw, 120px); }
.dm-detail-preview__extras .dm-casebook-section > h2 {
  font-size: var(--sz-d);
  line-height: var(--lh-d);
  font-weight: 400;
}
@media (max-width: 900px) {
  .dm-detail-preview__media--banners { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .dm-detail-preview__text--heading-only > h2 { grid-column: 1; }
  .dm-detail-preview__media--trio { grid-template-columns: minmax(0, 1fr); gap: var(--s4); }
}

/* Adjacent project links sit in the same 12-column inner grid. */
.dm-project-nav {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--s4) var(--gutter);
}
.dm-project-nav > div { grid-column: 1 / -1; min-width: 0; }
.dm-project-nav .lnk { white-space: normal; max-width: 100%; }
.dm-project-nav__label { margin-bottom: var(--s1); color: #666; }
.dm-project-nav__key {
  display: inline;
  border: 0;
  color: inherit;
  font: inherit;
}
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .dm-project-nav__key {
    display: inline-block;
    margin-inline-start: .5em;
    padding: 0 .3em;
    border: 1px solid currentColor;
    border-radius: 3px;
    color: #666;
    font: 400 12px/18px var(--fm);
    vertical-align: .08em;
  }
}

/* Keep Gutenberg image columns in project chapters aligned to the site grid. */
.dm-detail-preview__chapter .dm-detail-preview__media > .wp-block-columns {
  gap: var(--gutter);
}
@media (max-width: 767px) {
  .dm-detail-preview__chapter .dm-detail-preview__media > .wp-block-columns {
    flex-direction: column;
  }
  .dm-detail-preview__chapter .dm-detail-preview__media > .wp-block-columns > .wp-block-column {
    flex-basis: auto;
    width: 100%;
  }
}


/* Chapter title and copy share their top edge. */
.dm-detail-preview__text {
  align-items: start;
}

/* Align the visible cap tops for paired chapter titles and copy. */
@media (min-width: 768px) {
  @supports (text-box-trim: trim-start) and (text-box-edge: cap alphabetic) {
    .dm-detail-preview__text:not(.dm-detail-preview__text--heading-only) > h2,
    .dm-detail-preview__text:not(.dm-detail-preview__text--heading-only) > .dm-detail-preview__copy > p:first-child {
      text-box-trim: trim-start;
      text-box-edge: cap alphabetic;
    }
  }
}


/* Project details: put the raster between the page background and all
   detail content. Transparent image gutters keep the grid visible, while
   images and text stay above it. Fixed navigation remains above the raster. */
body:has(main.dm-detail-preview) #page-bg { z-index: 1; }
body:has(main.dm-detail-preview) #grid-overlay,
body:has(main.dm-detail-preview) #baseline-grid { z-index: 2; }

/* Reserve two desktop title lines to keep project metadata stable. */
@media (min-width: 768px) {
  .dm-detail-preview .dm-detail-preview__title {
    min-height: 2lh;
  }
}