/* Individual editorial picture stories. Content remains visible without motion. */
.atelier-site .editorial-photo {
  margin: 0;
  min-width: 0;
}
.editorial-image {
  overflow: hidden;
  background: var(--soft);
}
.editorial-image img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 3/2;
  object-fit: cover;
  transition: transform 850ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
.editorial-photo figcaption {
  padding: 12px 0 0;
  color: var(--ink);
  font-size: 11px;
  line-height: 1.6;
}
.atelier-site .editorial-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 36px 6%;
  align-items: center;
  padding: 64px 48px 36px;
}
.editorial-spread {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr 0.55fr;
  align-items: end;
  gap: 18px;
}
.editorial-main {
  grid-column: 1/-1;
}
.editorial-main .editorial-image img {
  aspect-ratio: 4/3;
}
.editorial-detail {
  grid-column: 2;
  margin-top: -65px !important;
  position: relative;
  padding: 9px;
  background: var(--paper);
}
.editorial-detail figcaption {
  font-size: 10px;
}
.editorial-feature .feature-copy {
  min-width: 0;
}
.editorial-feature .feature-copy h2 {
  text-wrap: balance;
  font-size: clamp(30px, 3.6vw, 49px);
}
.editorial-feature .feature-copy > p {
  font-size: 15px;
  line-height: 1.8;
}
.editorial-feature .feature-copy .editorial-preparation {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  font-size: 12px;
}
.atelier-site .editorial-feature .feature-chapters {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  border: 0;
  padding: 0;
}
.atelier-site .editorial-feature .feature-chapters li {
  border: 0;
  border-top: 1px solid var(--line);
  padding: 18px 0 0;
  display: flex;
  align-items: baseline;
  gap: 14px;
  background: transparent;
  transform: none;
  border-radius: 0;
}
.atelier-site .editorial-feature .feature-chapters li > span {
  font-size: 11px;
  line-height: 1.5;
  color: var(--muted);
  background: transparent;
  width: auto;
  height: auto;
  min-width: 18px;
  padding: 0;
  border: 0;
}
.atelier-site .editorial-feature .feature-chapters li > b {
  font: 17px/1.4 var(--display);
  color: var(--ink);
}
.editorial-disclosure {
  grid-column: 1/-1;
  color: var(--muted);
  font-size: 10px;
}
.atelier-site .tier-bronze {
  min-width: 0;
}
.atelier-site.tier-bronze .atelier-service {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 0.65fr);
}
.service-editorial {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 12px 32px;
  align-items: center;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.service-editorial .editorial-photo {
  grid-row: 1/3;
}
.service-editorial img {
  aspect-ratio: 2.4/1;
}
.service-editorial > p {
  font-size: 14px;
  max-width: 360px;
  align-self: end;
  margin: 0;
}
.service-editorial > small {
  font-size: 10px;
  color: var(--muted);
  align-self: start;
}
.atelier-site .editorial-compact .editorial-spread {
  display: block;
}
.atelier-site .editorial-compact .editorial-detail {
  margin: 0 !important;
  padding: 0;
}
.atelier-site .editorial-compact .editorial-detail img {
  aspect-ratio: 4/3;
}
.atelier-site .curated-portfolio {
  display: block;
}
.curated-portfolio .portfolio-heading {
  margin-bottom: 44px;
  max-width: 880px;
}
.curated-portfolio .portfolio-heading p {
  max-width: 560px;
  font-size: 15px;
  line-height: 1.8;
}
.editorial-gallery {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 30px;
  align-items: start;
}
.gallery-lead {
  grid-column: 1/9;
}
.gallery-detail {
  grid-column: 9/-1;
  margin-top: 100px !important;
}
.gallery-context {
  grid-column: 3/11;
}
.editorial-gallery .gallery-lead img {
  aspect-ratio: 3/2;
}
.editorial-gallery .gallery-detail img {
  aspect-ratio: 3/4;
}
.editorial-gallery .gallery-context img {
  aspect-ratio: 2/1;
}
.curated-portfolio .portfolio-story {
  margin-top: 65px;
}
/* Foto: white magazine, a portrait with a small contact-print insert. */
.feature-foto .editorial-main .editorial-image img {
  aspect-ratio: 4/5;
}
.feature-foto .editorial-detail {
  grid-column: 2;
  margin-right: -15px;
}
.gallery-foto .gallery-lead {
  grid-column: 1/8;
}
.gallery-foto .gallery-lead img {
  aspect-ratio: 4/5;
}
.gallery-foto .gallery-detail {
  grid-column: 8/-1;
  margin-top: 120px !important;
}
.gallery-foto .gallery-detail img {
  aspect-ratio: 1;
}
.gallery-foto .gallery-context {
  grid-column: 5/-1;
}
/* DJ: a panoramic dance floor and the close detail of the mix. */
.atelier-site .feature-dj {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.feature-dj .editorial-spread {
  grid-column: 1/-1;
  grid-template-columns: 1.8fr 1fr;
  gap: 20px;
}
.feature-dj .editorial-main {
  grid-column: 1;
}
.feature-dj .editorial-main img {
  aspect-ratio: 1.6;
}
.feature-dj .editorial-detail {
  grid-column: 2;
  padding: 0;
  margin: 0 !important;
  background: transparent;
}
.feature-dj .editorial-detail img {
  aspect-ratio: 1;
}
.feature-dj .feature-copy {
  grid-column: 1/-1;
  max-width: 800px;
}
.feature-dj .feature-copy > p {
  max-width: 680px;
}
.gallery-dj .gallery-lead {
  grid-column: 1/-1;
}
.gallery-dj .gallery-lead img {
  aspect-ratio: 2.15;
}
.gallery-dj .gallery-detail {
  grid-column: 1/6;
  margin-top: 0 !important;
}
.gallery-dj .gallery-context {
  grid-column: 6/-1;
  margin-top: 65px !important;
}
/* Duo: the pages of a small concert programme. */
.feature-musik .editorial-spread {
  padding: 20px;
  background: #eee0c8;
  border: 1px solid #a75b3f;
  transform: rotate(-1.5deg);
}
.feature-musik .editorial-detail {
  background: #eee0c8;
}
.feature-musik .editorial-photo figcaption {
  color: #5a3021;
}
.gallery-musik .gallery-lead {
  grid-column: 1/8;
  padding: 16px;
  background: #eee0c8;
}
.gallery-musik .gallery-lead figcaption {
  color: #5a3021;
}
.gallery-musik .gallery-detail {
  grid-column: 8/-1;
}
.gallery-musik .gallery-context {
  grid-column: 2/10;
}
/* Celebrant: a letter accompanied by two quiet keepsakes. */
.feature-rede .editorial-spread {
  order: 2;
}
.feature-rede .feature-copy {
  order: 1;
}
.feature-rede .feature-chapters {
  order: 3;
}
.feature-rede .editorial-disclosure {
  order: 4;
}
.feature-rede .editorial-main .editorial-image {
  border-radius: 160px 160px 0 0;
}
.feature-rede .editorial-main img {
  aspect-ratio: 4/5;
}
.gallery-rede .gallery-lead {
  grid-column: 2/8;
}
.gallery-rede .gallery-lead .editorial-image {
  border-radius: 240px 240px 0 0;
}
.gallery-rede .gallery-lead img {
  aspect-ratio: 4/5;
}
.gallery-rede .gallery-detail {
  grid-column: 8/-1;
}
.gallery-rede .gallery-context {
  grid-column: 1/10;
}
/* Massage: generous landscape windows and linen tones. */
.feature-massage .editorial-spread {
  grid-template-columns: 1fr;
}
.feature-massage .editorial-main {
  grid-column: 1;
}
.feature-massage .editorial-main img {
  aspect-ratio: 1.65;
}
.feature-massage .editorial-detail {
  grid-column: 1;
  padding: 0;
  margin: 10px 0 0 30% !important;
  background: transparent;
}
.gallery-massage .gallery-lead {
  grid-column: 1/-1;
}
.gallery-massage .gallery-lead img {
  aspect-ratio: 2.5;
}
.gallery-massage .gallery-detail {
  grid-column: 1/6;
  margin-top: 0 !important;
}
.gallery-massage .gallery-detail .editorial-image {
  border-radius: 140px 140px 0 0;
}
.gallery-massage .gallery-context {
  grid-column: 7/-1;
  margin-top: 100px !important;
}
/* Tattoo: a numbered, monochrome worktable contact sheet. */
.feature-tattoo .editorial-spread {
  border: 1px solid var(--line);
  padding: 16px;
  gap: 16px;
}
.feature-tattoo .editorial-detail {
  margin: 0 !important;
  padding: 0;
  grid-column: 1/-1;
}
.feature-tattoo .editorial-detail img {
  aspect-ratio: 2.4;
}
.gallery-tattoo {
  gap: 12px;
}
.gallery-tattoo > figure {
  padding: 12px;
  border: 1px solid var(--line);
}
.gallery-tattoo .gallery-lead {
  grid-column: 1/8;
}
.gallery-tattoo .gallery-detail {
  grid-column: 8/-1;
  margin-top: 0 !important;
}
.gallery-tattoo .gallery-context {
  grid-column: 1/-1;
}
/* Piercing: sculptures on pedestals, with room around each object. */
.feature-piercing .editorial-spread {
  gap: 22px;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}
.feature-piercing .editorial-main {
  grid-column: 1;
}
.feature-piercing .editorial-detail {
  grid-column: 2;
  padding: 0;
  margin: 65px 0 0 !important;
  background: transparent;
}
.feature-piercing .editorial-main img,
.feature-piercing .editorial-detail img {
  aspect-ratio: 3/4;
}
.gallery-piercing > figure {
  grid-column: span 4;
}
.gallery-piercing .gallery-detail {
  margin-top: 100px !important;
}
.gallery-piercing .gallery-context {
  margin-top: 35px !important;
}
.gallery-piercing .editorial-image img {
  aspect-ratio: 3/4;
}
/* Salon: a bold portrait in a mirror-shaped frame. */
.feature-haar .editorial-main .editorial-image {
  border-radius: 200px 200px 6px 6px;
}
.feature-haar .editorial-main img {
  aspect-ratio: 4/5;
}
.feature-haar .editorial-detail {
  background: var(--soft);
  transform: rotate(3deg);
}
.gallery-haar .gallery-lead {
  grid-column: 1/8;
}
.gallery-haar .gallery-lead img {
  aspect-ratio: 4/5;
}
.gallery-haar .gallery-lead .editorial-image {
  border-radius: 220px 220px 0 0;
}
.gallery-haar .gallery-detail {
  grid-column: 8/-1;
  margin-top: 100px !important;
}
.gallery-haar .gallery-context {
  grid-column: 4/-1;
}
/* Video: full-width cinematic frames, no pretend play button. */
.atelier-site .feature-video {
  grid-template-columns: 1fr;
}
.feature-video .editorial-spread {
  grid-template-columns: 1.8fr 1fr;
  align-items: start;
}
.feature-video .editorial-main {
  grid-column: 1;
}
.feature-video .editorial-main img {
  aspect-ratio: 2.35;
}
.feature-video .editorial-detail {
  grid-column: 2;
  margin: 50px 0 0 !important;
  padding: 0;
  background: transparent;
}
.feature-video .feature-copy {
  max-width: 820px;
}
.feature-video .feature-copy > p {
  max-width: 680px;
}
.gallery-video .gallery-lead {
  grid-column: 1/-1;
}
.gallery-video .gallery-lead img {
  aspect-ratio: 2.35;
}
.gallery-video .gallery-detail {
  grid-column: 8/-1;
  margin-top: 0 !important;
}
.gallery-video .gallery-detail img {
  aspect-ratio: 1.5;
}
.gallery-video .gallery-context {
  grid-column: 1/8;
  grid-row: 2;
}
/* Beauty: a portrait spread and a small palette of materials. */
.feature-visagistik .editorial-main .editorial-image {
  border-radius: 48% 48% 0 0;
}
.feature-visagistik .editorial-main img {
  aspect-ratio: 4/5;
}
.feature-visagistik .editorial-detail {
  grid-column: 1;
  margin-left: -12px;
  transform: rotate(-3deg);
}
.gallery-visagistik .gallery-lead {
  grid-column: 4/11;
}
.gallery-visagistik .gallery-lead img {
  aspect-ratio: 4/5;
}
.gallery-visagistik .gallery-detail {
  grid-column: 1/6;
  grid-row: 2;
  margin-top: -80px !important;
  padding: 12px;
  background: var(--paper);
  position: relative;
}
.gallery-visagistik .gallery-detail img {
  aspect-ratio: 1;
}
.gallery-visagistik .gallery-context {
  grid-column: 7/-1;
  grid-row: 2;
}
.gallery-visagistik .gallery-context img {
  aspect-ratio: 4/5;
}
/* Dogs: friendly postcards from outside and the quiet break afterwards. */
.feature-hund .editorial-main {
  background: #fff8e8;
  padding: 12px;
  transform: rotate(-2deg);
}
.feature-hund .editorial-main figcaption {
  color: #233d26;
}
.feature-hund .editorial-detail {
  background: #fff8e8;
  transform: rotate(4deg);
}
.feature-hund .editorial-detail figcaption {
  color: #233d26;
}
.gallery-hund .gallery-lead {
  grid-column: 1/9;
  padding: 15px;
  background: #fff8e8;
}
.gallery-hund .gallery-lead figcaption {
  color: #233d26;
}
.gallery-hund .gallery-detail {
  grid-column: 9/-1;
}
.gallery-hund .gallery-context {
  grid-column: 4/12;
}
/* Cats: a soft window and a small snapshot beside it. */
.feature-katze .editorial-main .editorial-image {
  border-radius: 130px 130px 12px 12px;
}
.feature-katze .editorial-main img {
  aspect-ratio: 4/5;
}
.feature-katze .editorial-detail {
  grid-column: 1;
  padding: 8px;
  border: 1px solid var(--line);
}
.gallery-katze .gallery-lead {
  grid-column: 1/8;
}
.gallery-katze .gallery-lead .editorial-image {
  border-radius: 180px 180px 0 0;
}
.gallery-katze .gallery-lead img {
  aspect-ratio: 4/5;
}
.gallery-katze .gallery-detail {
  grid-column: 8/-1;
  margin-top: 150px !important;
}
.gallery-katze .gallery-context {
  grid-column: 3/11;
}
/* Music lessons: two pages of a blue practice notebook. */
.feature-musikunterricht .editorial-spread {
  grid-template-columns: 1fr;
  border-left: 3px solid var(--accent);
  padding-left: 20px;
}
.feature-musikunterricht .editorial-detail {
  grid-column: 1;
  margin: 0 0 0 28% !important;
  padding: 0;
  background: transparent;
}
.gallery-musikunterricht .gallery-lead {
  grid-column: 1/9;
}
.gallery-musikunterricht .gallery-detail {
  grid-column: 9/-1;
  margin-top: 45px !important;
}
.gallery-musikunterricht .gallery-context {
  grid-column: 2/10;
  border-left: 3px solid var(--accent);
  padding-left: 18px;
}
/* Tutoring: an open exercise book, with a margin for the little discoveries. */
.feature-nachhilfe .editorial-spread {
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  background: #fffbed;
}
.feature-nachhilfe .editorial-photo figcaption {
  color: #494225;
}
.feature-nachhilfe .editorial-detail {
  margin: 0 !important;
  padding: 0;
  background: transparent;
  grid-column: 1/-1;
  width: 68%;
  justify-self: end;
}
.feature-nachhilfe .editorial-detail img {
  aspect-ratio: 2;
}
.gallery-nachhilfe .gallery-lead {
  grid-column: 2/9;
  border-left: 2px solid var(--accent);
  padding-left: 18px;
}
.gallery-nachhilfe .gallery-detail {
  grid-column: 9/-1;
  margin-top: 70px !important;
}
.gallery-nachhilfe .gallery-context {
  grid-column: 1/9;
}
.atelier-site .editorial-compact .editorial-spread {
  grid-column: auto;
  order: initial;
  transform: none;
  border: 0;
  background: transparent;
  padding: 0;
}
.atelier-site .editorial-compact .feature-copy {
  grid-column: auto;
  order: initial;
}
.atelier-site .editorial-compact {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.atelier-site .editorial-compact .editorial-detail {
  width: auto;
  transform: none;
  background: transparent;
}
/* Quiet tactile feedback, with system and page-level motion controls. */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  body:not(.motion-paused) .editorial-photo:hover img {
    transform: scale(1.035);
  }
  body:not(.motion-paused) .atelier-cta:hover svg {
    transform: translateX(4px);
  }
  .atelier-cta svg {
    transition: transform 250ms ease;
  }
}
@media (max-width: 1050px) {
  .atelier-site .editorial-feature {
    gap: 28px;
    padding: 45px 30px 28px;
  }
  .editorial-feature .feature-copy h2 {
    font-size: 33px;
  }
  .editorial-feature .feature-copy > p {
    font-size: 14px;
  }
  .editorial-gallery {
    gap: 20px;
  }
  .editorial-detail {
    margin-top: -35px !important;
  }
}
@media (max-width: 720px) {
  .atelier-site .editorial-feature,
  .atelier-site .editorial-compact {
    grid-template-columns: minmax(0, 1fr);
    padding: 36px 22px 24px;
    gap: 25px;
  }
  .editorial-feature .feature-copy h2 {
    font-size: 32px;
  }
  .editorial-feature .feature-copy > p {
    font-size: 14px;
  }
  .editorial-feature .editorial-spread {
    grid-column: 1;
    max-width: 100%;
    order: 2;
  }
  .editorial-feature .feature-copy {
    grid-column: 1;
    order: 1;
  }
  .atelier-site .editorial-feature .feature-chapters {
    order: 3;
    grid-template-columns: 1fr;
    gap: 0;
  }
  .atelier-site .editorial-feature .feature-chapters li {
    padding: 13px 0;
  }
  .editorial-feature .editorial-disclosure {
    order: 4;
  }
  .editorial-main .editorial-image img {
    max-height: 440px;
  }
  .feature-foto .editorial-main img,
  .feature-haar .editorial-main img,
  .feature-visagistik .editorial-main img,
  .feature-katze .editorial-main img {
    aspect-ratio: 1;
  }
  .feature-dj .editorial-spread,
  .feature-video .editorial-spread {
    grid-template-columns: 1fr;
  }
  .feature-dj .editorial-detail,
  .feature-video .editorial-detail {
    grid-column: 1;
    width: 65%;
    justify-self: end;
    margin: 0 !important;
  }
  .feature-dj .editorial-detail img,
  .feature-video .editorial-detail img {
    aspect-ratio: 1.8;
  }
  .feature-rede .editorial-main img {
    aspect-ratio: 1;
  }
  .atelier-site.tier-bronze .atelier-service {
    grid-template-columns: minmax(0, 1fr);
  }
  .service-editorial {
    grid-template-columns: minmax(0, 1fr);
    gap: 15px;
    padding-top: 24px;
  }
  .service-editorial .editorial-photo {
    grid-row: auto;
  }
  .service-editorial img {
    aspect-ratio: 1.7;
  }
  .service-editorial > p {
    max-width: none;
  }
  .curated-portfolio .portfolio-heading {
    margin-bottom: 28px;
  }
  .curated-portfolio .portfolio-heading p {
    font-size: 14px;
  }
  .editorial-gallery {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 26px 14px;
  }
  .editorial-gallery .gallery-lead {
    grid-column: 1/-1;
    grid-row: auto;
  }
  .editorial-gallery .gallery-detail {
    grid-column: 3/-1;
    grid-row: auto;
    margin: 0 !important;
  }
  .editorial-gallery .gallery-context {
    grid-column: 1/-1;
    grid-row: auto;
    margin: 0 !important;
  }
  .editorial-gallery .gallery-detail img {
    aspect-ratio: 1.25;
  }
  .editorial-gallery .gallery-context img {
    aspect-ratio: 1.5;
  }
  .gallery-foto .gallery-lead img,
  .gallery-haar .gallery-lead img,
  .gallery-visagistik .gallery-lead img {
    aspect-ratio: 4/5;
  }
  .gallery-piercing .gallery-detail {
    grid-column: 2/-1;
  }
  .gallery-piercing .gallery-context {
    grid-column: 1/6;
  }
  .gallery-piercing .editorial-image img {
    aspect-ratio: 1;
  }
  .gallery-rede .gallery-lead,
  .gallery-katze .gallery-lead {
    grid-column: 1/6;
  }
  .gallery-video .gallery-lead img {
    aspect-ratio: 1.85;
  }
  .gallery-video .gallery-detail {
    grid-column: 2/-1;
  }
  .gallery-musik .gallery-context,
  .gallery-hund .gallery-context {
    grid-column: 1/6;
  }
  .gallery-nachhilfe .gallery-detail {
    grid-column: 2/-1;
  }
  .curated-portfolio .portfolio-story {
    margin-top: 40px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .editorial-image img,
  .atelier-cta svg {
    transition: none;
  }
}
.motion-paused .editorial-image img,
.motion-paused .atelier-cta svg {
  transition: none;
  transform: none;
}
.atelier-site .service-editorial > small {
  color: inherit;
}
.atelier-site .feature-musik.editorial-compact .editorial-photo figcaption {
  color: var(--ink);
}
.atelier-site .service-haar .editorial-photo figcaption {
  color: var(--paper);
}
.atelier-site .editorial-feature .feature-chapters li {
  aspect-ratio: auto;
  min-height: 0;
  flex-direction: row;
  justify-content: flex-start;
}
body.motion-paused .atelier-cta:hover,
body.motion-paused .experience-choice:hover {
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .atelier-cta:hover,
  .experience-choice:hover {
    transform: none;
  }
}

@media (max-width: 720px) {
  :is(
      .feature-foto,
      .feature-musik,
      .feature-rede,
      .feature-haar,
      .feature-visagistik,
      .feature-hund,
      .feature-katze
    )
    .editorial-spread {
    grid-template-columns: 0.8fr 1fr;
  }
}
