/* Real project sequences: keep each camera perspective intact. */
.project-stories { position: relative; padding-block: var(--section); background: var(--coal-soft); border-bottom: 1px solid var(--line); }
.stories-heading { display: grid; grid-template-columns: 1.15fr .85fr; gap: 3rem; align-items: end; margin-bottom: 3rem; }
.stories-heading h2 { max-width: 13ch; margin-bottom: 0; }
.stories-heading .lead { max-width: 29rem; margin: 0 0 .25rem; }
.story-nav { display: flex; flex-wrap: wrap; gap: .6rem 2rem; padding-block: 1.2rem; margin: 0 0 5rem; border-block: 1px solid var(--line); }
.story-nav a { display: inline-flex; align-items: center; gap: .8rem; min-height: 2rem; color: var(--dust); font-size: .76rem; letter-spacing: .06em; }
.story-nav a::after { content: '↘'; color: var(--wood-light); font-size: 1rem; }
.story-nav a:hover { color: var(--chalk); }
.project-story { scroll-margin-top: 7rem; }
.project-story + .project-story { margin-top: clamp(5rem, 9vw, 9rem); padding-top: clamp(3rem, 6vw, 6rem); border-top: 1px solid var(--line); }
.project-story__heading { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items: end; margin-bottom: 2rem; }
.project-story__heading h3 { max-width: 19ch; margin-bottom: 0; font-family: var(--display); font-size: clamp(2rem, 3.9vw, 4rem); font-weight: 400; letter-spacing: -.035em; line-height: 1.04; }
.project-story__heading p { max-width: 30rem; margin-bottom: .2rem; color: var(--dust); }
.project-story__heading .measure-label { margin-bottom: 1rem; }
.project-story__images { display: grid; grid-template-columns: minmax(0, .31fr) minmax(0, .69fr); align-items: end; gap: clamp(1rem, 3vw, 2.5rem); }
.project-story figure { position: relative; min-width: 0; margin: 0; }
.story-photo { display: block; position: relative; overflow: hidden; background: var(--coal); }
.story-photo img { width: 100%; height: auto; transition: filter .4s var(--ease); }
.story-photo:hover img { filter: brightness(1.07); }
.story-photo__zoom { display: grid; position: absolute; right: .85rem; bottom: .85rem; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid rgba(241,238,231,.65); color: var(--chalk); background: rgba(11,11,10,.8); }
.story-photo__zoom svg { width: 1.05rem; height: 1.05rem; }
.project-story figcaption { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding-top: .9rem; font-size: .67rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--dust); }
.project-story figcaption::before { flex: 1; order: 1; height: 1px; margin-left: .5rem; background: var(--line); content: ''; }
.project-story__after figcaption { color: var(--wood-light); }
.project-story--kitchen .project-story__images { grid-template-columns: minmax(0,.43fr) minmax(0,.57fr); }
.stories-end { display: flex; justify-content: flex-end; margin-top: 3.5rem; }
#projektgalerie { scroll-margin-top: 4.5rem; }
@media (max-width: 980px) {
  .stories-heading { grid-template-columns: 1fr; gap: 1.5rem; }
  .stories-heading h2 { max-width: 15ch; }
  .project-story__heading { grid-template-columns: 1fr; gap: 1rem; }
  .project-story__heading h3 { max-width: 25ch; }
}
@media (max-width: 600px) {
  .stories-heading h2 { font-size: clamp(2.7rem, 12vw, 4rem); }
  .story-nav { gap: .5rem 1.4rem; margin-bottom: 3rem; }
  .project-story__heading { margin-bottom: 1.5rem; }
  .project-story__images, .project-story--kitchen .project-story__images { grid-template-columns: minmax(0, 1fr); gap: 1.8rem; }
  .project-story__before { width: 62%; }
  .project-story--kitchen .project-story__before { width: 80%; }
  .project-story__after { width: 100%; }
  .project-story figcaption { font-size: .59rem; letter-spacing: .08em; }
  .stories-end { justify-content: flex-start; }
}
.project-story--restoration .project-story__images {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}
.project-story--restoration .project-story__before,
.project-story--restoration .project-story__after { width: 100%; }
.restoration-details { margin-top: 2rem; border-block: 1px solid var(--line); }
.restoration-details summary {
  cursor: pointer;
  padding: 1.2rem 0;
  color: var(--chalk);
  font-size: 1rem;
  line-height: 1.5;
}
.restoration-details summary::marker { color: var(--wood-light); }
.restoration-details summary:focus-visible { outline: 2px solid var(--wood-light); outline-offset: 4px; }
.restoration-details summary span { margin-left: .7rem; color: var(--dust); font-size: .85rem; }
.restoration-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; padding: .4rem 0 1.6rem; }
@media (max-width: 600px) {
  .project-story--restoration .project-story__images { gap: .8rem; }
  .project-story--restoration figcaption { font-size: .62rem; letter-spacing: .08em; }
  .restoration-details summary span { display: block; margin-left: 1rem; }
  .restoration-steps { grid-template-columns: 1fr; gap: 1.5rem; }
}
