/* N27 italic cuts used by the wordmark. Global map only has 300/700 italic. */
@font-face {
  font-family: N27;
  src: url("/n27/n27-thinitalic-webfont.woff2") format("woff2");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: N27;
  src: url("/n27/n27-extralightitalic-webfont.woff2") format("woff2");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: N27;
  src: url("/n27/n27-regularitalic-webfont.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: N27;
  src: url("/n27/n27-mediumitalic-webfont.woff2") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

/*
  Product world tokens from 20260817_v05.
  Orange stays on the Ciferecigo shell only. It must not enter this canvas.
*/
.zukunft-app {
  --color-carbon: #20201f;
  --color-porcelain: #f8f8f5;
  --color-sapphire: #004cd0;
  --color-gold: #ffb300;
  --color-surface: var(--color-porcelain);
  --color-text: var(--color-carbon);
  --color-muted: #5c5c59;
  --color-line: rgba(32, 32, 31, .18);
  --color-panel: #f8f8f5;
  --color-link: var(--color-sapphire);
  --color-focus: var(--color-sapphire);
  --radius-s: 8px;
  --radius-m: 16px;
  --radius-pill: 999px;
  --space: 8px;
  --pad-x: 24px;
  --content: 75rem;
  --wide: 90rem;
  --ia-width: 18.5rem;
  --header-offset: calc(2.1rem + clamp(1.35rem, 2.3vw, 2.2rem));
  padding-top: var(--header-offset);
  overflow-x: clip;
  margin: 0;
  color: var(--color-text);
  background: var(--color-surface);
  font-family: N27, Arial, sans-serif;
  font-size: 19px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
}

.zukunft-app > .grain { z-index: 23; }

html[data-theme="dark"] .zukunft-app {
  --color-surface: var(--paper, #111110);
  --color-text: #f8f8f5;
  --color-muted: #c4c4be;
  --color-line: rgba(248, 248, 245, .2);
  --color-panel: #2a2a28;
  --color-link: #7aa6ff;
  --color-focus: #7aa6ff;
}

.z-mark {
  box-shadow: inset 0 -.16em 0 color-mix(in srgb, var(--color-gold) 62%, transparent);
}
.z-start a:not(.z-button):not(.button):not(.ed-index a):not(.ed-list a):not(.z-ia a):not(.z-enter a):not(.z-lane a) {
  color: var(--color-sapphire);
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .2s ease-out;
}
.z-start a:not(.z-button):not(.button):not(.ed-index a):not(.ed-list a):not(.z-ia a):not(.z-enter a):not(.z-lane a):hover {
  background-size: 100% 1px;
}

.zukunft-app .brand-zukunft {
  font-family: N27, sans-serif;
  font-style: italic;
  font-weight: 200;
  white-space: nowrap;
  color: var(--color-link);
}
.z-display-mark.brand-zukunft,
.z-shell h1 .brand-zukunft,
.z-shell h2 .brand-zukunft,
.z-shell h3 .brand-zukunft {
  font-weight: 100;
}
.z-display-mark.brand-zukunft,
.z-ia .brand-zukunft {
  color: inherit;
}
.z-section--sapphire .brand-zukunft {
  color: var(--color-porcelain);
}

.z-skip {
  position: fixed;
  z-index: 999;
  left: 1rem;
  top: -6rem;
  padding: .75rem 1rem;
  color: var(--color-porcelain);
  background: var(--color-carbon);
}
.z-skip:focus { top: calc(var(--header-offset) + .4rem); }

.z-shell { min-width: 0; }
.z-shell [id] { scroll-margin-top: calc(var(--header-offset) + 5.75rem); }
.z-page,
.z-context { display: none !important; }

/* Product IA — second layer, not a second Ciferecigo header */
.z-ia { position: relative; z-index: 22; }

.z-ia-kicker { margin: 0; }
.z-ia-kicker a,
.z-ia .brand-zukunft {
  display: block;
  font-family: inherit;
  font-size: inherit;
  font-style: normal;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-decoration: none;
  white-space: nowrap;
}
.z-ia-areas .brand-zukunft {
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.z-ia-story,
.z-ia-num { display: none; }

.z-ia-mobile {
  position: sticky;
  top: var(--header-offset);
  z-index: 24;
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
  backdrop-filter: blur(12px);
}
.z-ia-areas {
  display: flex;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
  padding: .15rem var(--pad-x) 0;
  gap: .15rem;
}
.z-ia-areas a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: .75rem .95rem .6rem;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: -.02em;
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  transition: color .2s ease-out, border-color .2s ease-out;
}
.z-ia-areas a:hover { color: var(--color-sapphire); }
.z-ia-areas a[aria-current="page"] {
  font-weight: 500;
  font-style: italic;
  color: var(--color-sapphire);
  border-color: var(--color-sapphire);
}
.z-ia-toc { border-top: 0; }
.z-ia-toc summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: .65rem var(--pad-x);
  cursor: pointer;
  list-style: none;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .08em;
}
.z-ia-toc summary::-webkit-details-marker { display: none; }
.z-ia-toc summary::after { content: '↓'; font-size: .75rem; font-weight: 400; }
.z-ia-toc[open] summary::after { content: '↑'; }
.z-ia-subs { display: grid; padding: 0 var(--pad-x) 1.1rem; }
.z-ia-subs a {
  display: block;
  min-height: 44px;
  padding: .75rem 0;
  text-decoration: none;
  font-weight: 400;
}
.z-ia-subs a:hover { color: var(--color-sapphire); }
.z-ia-subs a.is-active {
  font-weight: 500;
  padding-left: .7rem;
  color: var(--color-sapphire);
  border-left: 2px solid var(--color-sapphire);
}

.z-ia-side { display: none; }

/* Editorial type */
.z-hero,
.z-section {
  padding-inline: var(--pad-x);
}
.z-hero {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: min(46rem, 76svh);
  padding-block: clamp(6rem, 16vw, 10rem) clamp(3rem, 8vw, 5rem);
}
.z-start .z-hero {
  padding-bottom: clamp(2.5rem, 6vw, 4rem);
  padding-inline: var(--pad);
}
.z-hero--compact { min-height: 64svh; }
.z-section { padding-block: clamp(6rem, 17vw, 11rem); }
.z-section > * { max-width: var(--content); margin-inline: auto; }
.z-section > p,
.z-copy { max-width: 72ch; margin-left: auto; margin-right: auto; font-size: 1.15rem; }
.z-section > p + p { margin-top: 1.5rem; }

.z-section--carbon { color: var(--color-porcelain); background: var(--color-carbon); }
.z-section--carbon a { color: var(--color-porcelain); }
.z-section--gold { color: var(--color-carbon); background: var(--color-gold); }
.z-section--gold a:not(.button):not(.z-button) { color: var(--color-carbon); text-decoration: underline; text-underline-offset: .18em; }
.z-section--sapphire { color: var(--color-porcelain); background: var(--color-sapphire); }
.z-section--sapphire a:not(.button):not(.z-button) { color: var(--color-porcelain); text-decoration: underline; text-underline-offset: .18em; }
.z-section--sapphire .z-card,
.z-section--carbon .z-card,
.z-section--gold .z-card {
  color: var(--color-carbon);
  background: var(--color-porcelain);
}
html[data-theme="dark"] .z-section--sapphire .z-card,
html[data-theme="dark"] .z-section--carbon .z-card,
html[data-theme="dark"] .z-section--gold .z-card {
  color: var(--color-text);
  background: var(--color-panel);
}
.z-section--sapphire .z-card a,
.z-section--carbon .z-card a,
.z-section--gold .z-card a { color: var(--color-link); text-decoration: none; }

.z-kicker,
.z-eyebrow {
  display: block;
  margin-bottom: 1.25rem;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.z-display-mark {
  display: block;
  margin: 0 0 .22em;
  font-family: N27, sans-serif;
  font-size: clamp(4.2rem, 16vw, 11rem);
  font-weight: 100;
  font-style: italic;
  line-height: .72;
  letter-spacing: -.08em;
}

.z-shell h1,
.z-shell h2,
.z-shell h3,
.z-shell h4 {
  font-family: N27, Arial, sans-serif;
  letter-spacing: -.055em;
}
.z-shell h1 {
  max-width: 13ch;
  margin: 0 0 2rem;
  font-size: clamp(2.5rem, 9.4vw, 5.6rem);
  font-weight: 500;
  line-height: .9;
  overflow-wrap: break-word;
}
.z-shell h2 {
  max-width: 14ch;
  margin: 0 0 2.4rem;
  font-size: clamp(2.15rem, 7.6vw, 4.6rem);
  font-weight: 500;
  line-height: .92;
}
.z-shell h3 {
  margin: 0 0 1rem;
  font-size: clamp(1.45rem, 4.2vw, 2.4rem);
  font-weight: 500;
  line-height: 1.08;
}
.z-shell h4 {
  margin: 2rem 0 .75rem;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.z-lead {
  max-width: 38ch;
  margin: 0;
  font-size: clamp(1.2rem, 2.8vw, 1.7rem);
  font-weight: 400;
  line-height: 1.28;
}
.z-hero .z-lead + .z-lead { margin-top: 1.15em; }
.z-intro {
  max-width: 40ch;
  font-size: clamp(1.25rem, 3vw, 1.85rem);
  font-weight: 400;
  line-height: 1.28;
}
.z-muted { color: var(--color-muted); }
.z-stack {
  margin: 2.5rem auto;
  padding: 0;
  list-style: none;
  max-width: 18ch;
  font-size: clamp(1.8rem, 5.2vw, 3.4rem);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -.045em;
}
.z-stack li { margin: 0; }

.z-actions { margin-top: 3rem; }

.z-grid { display: grid; gap: 1rem; margin-top: 2.5rem; }
.z-card {
  min-width: 0;
  padding: 24px;
  background: var(--color-panel);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-m);
}
.z-card p { max-width: 48ch; }
.z-card a {
  color: var(--color-link);
  text-decoration: none;
}
.z-card a:hover { text-decoration: underline; text-underline-offset: .18em; }
.z-card--line { background: transparent; }
.z-status {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  margin-bottom: 1rem;
  padding: .28rem .6rem;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  border: 1px solid currentColor;
  border-radius: var(--radius-s);
}
.z-status::before {
  width: .4rem;
  height: .4rem;
  margin-right: .45rem;
  content: '';
  background: currentColor;
  border-radius: 50%;
}

.z-roadmap { display: grid; gap: 1rem; margin-top: 2.5rem; }
.z-roadmap-card {
  padding: 24px;
  color: var(--color-carbon);
  background: var(--color-porcelain);
  border: 1px solid var(--color-line);
  border-left: 2px solid var(--color-sapphire);
  border-radius: var(--radius-m);
}
.z-section--carbon .z-roadmap-card,
.z-section--sapphire .z-roadmap-card,
.z-section--gold .z-roadmap-card {
  color: var(--color-carbon);
  background: var(--color-porcelain);
}
.z-roadmap-card h3,
.z-roadmap-card dd {
  color: inherit;
}
html[data-theme="dark"] .z-roadmap-card {
  color: var(--color-carbon);
  background: var(--color-porcelain);
}
.z-roadmap-card[data-accent="gold"] { border-left-color: var(--color-gold); }
.z-roadmap-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.z-roadmap-head h3 { margin-bottom: .5rem; }
.z-roadmap-meta { display: grid; gap: 1rem; margin: 1.5rem 0 0; }
.z-roadmap-meta div { padding-top: .85rem; }
.z-roadmap-meta dt {
  margin-bottom: .3rem;
  color: var(--color-muted);
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.z-roadmap-meta dd { margin: 0; }

.z-path { counter-reset: path; display: grid; gap: 0; margin: 2rem 0; padding: 0; list-style: none; }
.z-path li {
  position: relative;
  min-height: 4rem;
  padding: .85rem 0 .85rem 3.6rem;
  border-left: 1px solid var(--color-line);
}
.z-path li::before {
  position: absolute;
  left: -.95rem;
  top: .65rem;
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  counter-increment: path;
  content: counter(path, decimal-leading-zero);
  color: var(--color-porcelain);
  background: var(--color-sapphire);
  border-radius: 50%;
  font-size: .62rem;
  font-weight: 500;
}
.z-section--sapphire .z-path li::before,
.z-section--carbon .z-path li::before {
  color: var(--color-carbon);
  background: var(--color-gold);
}
.z-path strong { display: block; }

.z-topic { display: grid; gap: 1rem; padding: 2.2rem 0; }
.z-topic h3 { max-width: 18ch; }
.z-topic p { max-width: 58ch; }
.z-topic-route { color: var(--color-muted); font-size: .88rem; }

.z-flow { display: flex; flex-wrap: wrap; gap: .5rem; margin: 2.2rem 0; }
.z-flow span {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: .45rem .75rem;
  border: 1px solid currentColor;
  border-radius: var(--radius-s);
  font-size: .88rem;
}
.z-flow span + span::before { margin-right: .55rem; content: '→'; }

.z-shell blockquote {
  max-width: 28ch;
  margin: 3rem 0;
  padding: 1.6rem 0;
  font-family: N27, sans-serif;
  font-size: clamp(1.7rem, 5.4vw, 3.4rem);
  font-weight: 400;
  font-style: italic;
  line-height: 1.08;
  letter-spacing: -.04em;
}

.z-principles { counter-reset: principles; display: grid; gap: 0; margin-top: 2rem; }
.z-principles article {
  position: relative;
  padding: 1.6rem 0 1.6rem 3.5rem;
}
.z-principles article::before {
  position: absolute;
  left: 0;
  counter-increment: principles;
  content: counter(principles, decimal-leading-zero);
  color: var(--color-link);
  font-weight: 500;
}

.z-table-wrap { max-width: var(--content); margin: 2rem auto; overflow-x: auto; }
.z-shell table { width: 100%; min-width: 42rem; border-collapse: collapse; }
.z-shell th,
.z-shell td {
  padding: 1rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--color-line);
}
.z-shell th { font-weight: 500; }

.zukunft-app :focus-visible,
.z-shell :focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
}
.z-section--gold :focus-visible { outline-color: var(--color-carbon); }
.z-section--sapphire :focus-visible { outline-color: var(--color-gold); }

.z-shell fieldset { padding: 0; margin: 0; border: 0; }
.z-shell legend {
  margin-bottom: 1.5rem;
  font-size: clamp(1.5rem, 5vw, 2.6rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.03em;
}
.pq { max-width: 56rem; }
.pq-progress {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .75rem;
}
.pq-options { display: grid; gap: .65rem; margin: 1.5rem 0; }
.pq-option {
  display: flex;
  align-items: center;
  gap: .8rem;
  min-height: 56px;
  padding: 1rem;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-s);
  cursor: pointer;
}
.pq-option:has(input:checked) {
  border-color: var(--color-link);
  background: color-mix(in srgb, var(--color-link) 10%, transparent);
}
.pq-result { padding-top: 1.5rem; }
.micro-help {
  padding: 1.2rem;
  margin: 1.5rem 0;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-s);
}
.micro-help summary {
  min-height: 44px;
  font-weight: 500;
  cursor: pointer;
}
.z-form label,
.micro-help label { display: block; margin: 1rem 0; }
.z-shell input[type="text"],
.z-shell input[type="email"],
.z-shell input[type="tel"],
.z-shell textarea,
.z-shell select {
  width: 100%;
  min-height: 56px;
  padding: .85rem 1rem;
  color: inherit;
  background: var(--color-panel);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-s);
}
.z-shell textarea { min-height: 9rem; }
.z-shell input:focus,
.z-shell textarea:focus,
.z-shell select:focus {
  border-color: var(--color-focus);
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-focus) 25%, transparent);
}
.z-note {
  max-width: 64ch;
  padding: 1.1rem 1.2rem;
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-gold) 16%, var(--color-panel));
  border-left: 2px solid var(--color-gold);
  border-radius: var(--radius-s);
}
.z-noscript { padding: 1rem; border: 2px solid var(--color-sapphire); border-radius: var(--radius-s); }
.z-hidden { display: none !important; }
.transfer-preview {
  min-height: 6rem;
  padding: 1rem;
  white-space: pre-wrap;
  background: var(--color-panel);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-s);
}
.z-form-note { font-size: .9rem; }

@media (min-width: 48rem) {
  .z-hero,
  .z-section { padding-inline: clamp(24px, 4vw, 64px); }
  .z-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .z-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .z-roadmap-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .z-topic { grid-template-columns: minmax(12rem, .7fr) minmax(0, 1.3fr); }
  .z-card { padding: 32px; }
}

@media (min-width: 72rem) {
  .z-ia-mobile { display: none; }
  .z-shell {
    display: block;
    padding-left: var(--ia-width);
  }
  .z-ia {
    position: fixed;
    top: var(--header-offset);
    left: 0;
    z-index: 22;
    width: var(--ia-width);
    height: calc(100svh - var(--header-offset));
    padding: 2.5rem 1.75rem 3rem var(--pad, 4rem);
    overflow: auto;
    background: transparent;
  }
  .zukunft-app footer {
    position: relative;
    z-index: 24;
  }
  .z-ia-side { display: block; }
  .z-shell > main { min-width: 0; }

  .z-ia-kicker { margin: 0; }
  .z-ia-kicker a,
  .z-ia-kicker a.brand-zukunft,
  .z-ia-kicker a[aria-current="page"] {
    min-height: 2.15rem;
    padding: .2rem 0;
    color: inherit;
    font-family: inherit;
    font-size: 1.35rem;
    font-style: normal;
    font-weight: 500;
    letter-spacing: -.03em;
    line-height: 1.2;
  }
  .z-ia-kicker a:hover { color: var(--color-sapphire); }
  .z-ia-tree {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .z-ia-tree > li { margin: 0; padding: 0; }
  .z-ia-area {
    display: block;
    min-height: 2.15rem;
    padding: .2rem 0;
    text-decoration: none;
    font-size: 1.35rem;
    font-weight: 500;
    letter-spacing: -.03em;
    line-height: 1.2;
  }
  .z-ia-area::after { content: none; }
  .z-ia-area:hover { color: var(--color-sapphire); }
  .z-ia-tree > li.is-current .z-ia-area { color: var(--color-sapphire); }
  .z-ia-subs-desktop {
    display: none;
    margin: 0 0 .55rem;
    padding: .1rem 0 .35rem;
    list-style: none;
  }
  .z-ia-tree > li.is-open .z-ia-subs-desktop { display: grid; }
  .z-ia-subs-desktop a {
    display: block;
    min-height: 1.65rem;
    padding: .12rem 0;
    text-decoration: none;
    font-size: .92rem;
    font-weight: 100;
    letter-spacing: -.02em;
    line-height: 1.25;
    color: var(--color-muted);
  }
  .z-ia-subs-desktop a:hover,
  .z-ia-subs-desktop a.is-active {
    color: var(--color-sapphire);
    font-weight: 100;
  }

  .z-roadmap-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .z-shell [id] { scroll-margin-top: calc(var(--header-offset) + 2rem); }
}

@media (max-width: 71.99rem) {
  .z-hero,
  .z-start .z-hero {
    min-height: 0;
    padding-block: 1.25rem 2.4rem;
  }
  .z-ia-areas {
    padding-left: var(--pad);
    padding-right: var(--pad);
  }
  .z-ia-areas a {
    padding-left: 0;
    padding-right: 1rem;
  }
  .z-ia-toc summary,
  .z-ia-subs { padding-inline: var(--pad); }
  .ed-say,
  .ed-read,
  .ed-quote,
  .ed-aside,
  .ed-verse,
  .ed-index,
  .ed-reply,
  .ed-list,
  .ed-cast,
  .ed-thin,
  .ed-strong {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-inline: var(--pad);
  }
  .ed-aside { max-width: none; }
}

@media (max-width: 22rem) {
  .z-hero,
  .z-section { padding-left: 1rem; padding-right: 1rem; }
  .z-shell h1 { font-size: clamp(2.2rem, 14vw, 3rem); }
}

@media (prefers-reduced-motion: reduce) {
  .zukunft-app *,
  .zukunft-app *::before,
  .zukunft-app *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}

/* —— Start page: one essay, not stacked landing pages —— */
.z-insert {
  color: var(--color-porcelain);
  background: var(--color-carbon);
  padding: clamp(2.4rem, 5.5vw, 4rem) var(--pad-x);
}
.z-insert-grid {
  display: grid;
  gap: 1.6rem;
  max-width: var(--content);
  margin: 0 auto;
}
.z-insert-mark {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(1.55rem, 3.2vw, 2.35rem);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.04em;
}
.z-insert-copy p {
  max-width: 48ch;
  margin: 0 0 1rem;
  font-size: 1.2rem;
  line-height: 1.48;
}
.z-insert-copy p:last-child { margin-bottom: 0; }

.z-essay {
  padding: clamp(3.2rem, 7vw, 5.5rem) var(--pad-x) clamp(1.5rem, 3vw, 2.5rem);
}
.z-essay-copy {
  max-width: 48ch;
  margin: 0;
}
.z-essay-copy p {
  margin: 0 0 1.15rem;
  font-size: clamp(1.2rem, 1.9vw, 1.48rem);
  line-height: 1.48;
}
.z-essay-copy p:last-child { margin-bottom: 0; }

.z-pause {
  display: grid;
  place-items: center;
  margin: 0;
  padding: clamp(5rem, 14vw, 9rem) var(--pad-x);
  text-align: center;
}
.z-pause blockquote {
  max-width: 22rem;
  margin: 0;
  padding: .2rem 0 .2rem 1.15rem;
  font-size: clamp(1.7rem, 4.2vw, 3.1rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.12;
  letter-spacing: -.04em;
  border: 0;
  border-left: 2px solid var(--color-gold);
}

.z-manifest {
  padding: clamp(3rem, 8vw, 6.5rem) var(--pad-x) clamp(2rem, 5vw, 3.5rem);
}
.z-manifest-a,
.z-manifest-b {
  margin: 0;
  line-height: .96;
  letter-spacing: -.055em;
}
.z-manifest-a {
  max-width: 11ch;
  margin-bottom: 1rem;
  font-size: clamp(1.9rem, 5.4vw, 3.8rem);
  font-weight: 200;
}
.z-manifest-b {
  max-width: 14ch;
  margin-bottom: 2rem;
  font-size: clamp(2.1rem, 6vw, 4.4rem);
  font-weight: 500;
}
.z-manifest-note {
  max-width: 28ch;
  margin: 0 0 0 auto;
  font-size: 1.08rem;
  line-height: 1.4;
  color: var(--color-muted);
}

.z-logic { padding: 1rem var(--pad-x) clamp(3.5rem, 8vw, 6rem); }
.z-logic-row {
  display: grid;
  gap: 1.6rem;
  max-width: var(--content);
  margin: 0 auto;
}
.z-logic-row article span {
  display: block;
  margin-bottom: .4rem;
  color: var(--color-muted);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.z-logic-row article p {
  max-width: 14ch;
  margin: 0;
  font-size: clamp(1.15rem, 1.8vw, 1.45rem);
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -.03em;
}

.z-chapters { padding: clamp(1rem, 3vw, 2rem) 0 clamp(2rem, 5vw, 3rem); }
.z-chapter {
  display: grid;
  gap: .7rem;
  padding: clamp(2.2rem, 5vw, 3.6rem) var(--pad-x);
  text-decoration: none;
}
.z-chapter-num {
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
}
.z-start .z-chapter h2 {
  max-width: 10ch;
  margin: 0;
  font-size: clamp(2.6rem, 7vw, 6.2rem);
  font-weight: 200;
  line-height: .86;
}
.z-chapter p {
  max-width: 28ch;
  margin: 0 0 .7rem;
  font-size: 1.12rem;
  line-height: 1.35;
}
.z-chapter-go {
  color: var(--color-link);
  font-size: .88rem;
}
.z-chapter:hover h2 { font-style: italic; }

.z-quiet { padding: clamp(3rem, 7vw, 5.5rem) var(--pad-x); }
.z-split {
  display: grid;
  gap: 1.6rem;
  max-width: var(--content);
  margin: 0 auto;
}
.z-start .z-quiet h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(1.55rem, 3vw, 2.3rem);
  font-weight: 500;
  line-height: 1.05;
}
.z-split p {
  max-width: 46ch;
  margin: 0 0 1rem;
  font-size: 1.05rem;
  line-height: 1.48;
}
.z-split p:last-child { margin-bottom: 0; }

.z-cta {
  color: var(--color-carbon);
  background: var(--color-gold);
  padding: clamp(4rem, 10vw, 7rem) var(--pad-x);
}
.z-cta-line {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(2.4rem, 7vw, 5.2rem);
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.055em;
}
.z-cta-note,
.z-cta-copy {
  max-width: 46ch;
  margin: 0;
  font-size: 1.12rem;
  line-height: 1.45;
}
.z-cta-copy p { margin: 0 0 1.05rem; }
.z-cta-copy p:last-child { margin-bottom: 0; }
.z-cta .button,
.z-cta .z-button {
  text-decoration: none;
}

/* —— Invitation essay —— */
.z-invite { padding: clamp(3rem, 7vw, 5rem) 0 0; }
.z-invite-hero,
.z-invite-note,
.z-invite-cast,
.z-invite-manifest,
.z-invite-ways { padding-inline: var(--pad-x); }
.z-invite-hero {
  display: grid;
  gap: 1.6rem;
  padding-bottom: clamp(2.5rem, 6vw, 4rem);
}
.z-start .z-invite-hero h2 {
  max-width: 14ch;
  margin: 0;
  font-size: clamp(2rem, 5.6vw, 4rem);
  font-weight: 500;
  line-height: .96;
}
.z-invite-prose { max-width: 44ch; }
.z-invite-prose p {
  margin: 0 0 1rem;
  font-size: 1.2rem;
  line-height: 1.48;
}
.z-invite-prose p:last-child { margin-bottom: 0; }

.z-invite-step {
  display: grid;
  gap: .55rem;
  margin: clamp(2rem, 5vw, 3.5rem) var(--pad-x);
  padding: clamp(1.6rem, 3.5vw, 2.6rem);
  max-width: 52rem;
  background: var(--color-panel);
}
.z-invite-step-kicker {
  margin: 0;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.z-start .z-invite-step h3 {
  max-width: 14ch;
  margin: 0;
  font-size: clamp(1.6rem, 3.2vw, 2.5rem);
  font-weight: 500;
  line-height: 1.05;
}
.z-invite-step p { margin: 0 0 .4rem; max-width: 36ch; }
.z-invite-step .button,
.z-invite-step .z-button { margin-top: .8rem; justify-self: start; }

.z-invite-note {
  padding-block: clamp(2rem, 5vw, 3.4rem);
}
.z-invite-note p {
  max-width: 46ch;
  margin: 0 0 1rem;
  font-size: 1.2rem;
  line-height: 1.48;
}
.z-invite-note p:last-child { margin-bottom: 0; }

.z-offer {
  display: grid;
  gap: 1px;
  margin: 0 var(--pad-x);
  background: var(--color-line);
  border: 1px solid var(--color-line);
}
.z-offer-card {
  display: grid;
  align-content: start;
  gap: .55rem;
  min-height: 11rem;
  padding: 1.4rem 1.3rem;
  background: var(--color-surface);
  text-decoration: none;
}
.z-offer-card i { font-size: 1.5rem; color: var(--color-sapphire); }
.z-offer-card strong {
  font-size: 1.25rem;
  font-weight: 500;
  letter-spacing: -.03em;
}
.z-offer-card span {
  max-width: 24ch;
  color: var(--color-muted);
  font-size: .95rem;
  line-height: 1.35;
}
.z-offer-card:hover { background: var(--color-panel); }
.z-offer-card:hover strong { font-style: italic; }

.z-invite-cast {
  display: grid;
  gap: 1.8rem;
  padding-block: clamp(2.5rem, 6vw, 4.5rem);
}
.z-invite-cast-mark {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(1.7rem, 4vw, 3rem);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -.045em;
}
.z-invite-names {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: clamp(1.35rem, 2.6vw, 2.1rem);
  font-weight: 200;
  line-height: 1.18;
  letter-spacing: -.03em;
}

.z-invite-manifest {
  display: grid;
  place-items: center;
  margin: 0;
  padding-block: clamp(4.5rem, 12vw, 8rem);
  text-align: center;
}
.z-invite-manifest blockquote {
  max-width: 18ch;
  margin: 0;
  padding: 0;
  font-size: clamp(1.6rem, 3.8vw, 2.8rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.14;
  letter-spacing: -.035em;
  border: 0;
}

.z-invite-ways {
  display: grid;
  gap: 1px;
  margin: 0 0 clamp(3rem, 7vw, 5rem);
  background: var(--color-line);
  border-block: 1px solid var(--color-line);
}
.z-invite-ways a {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2rem;
  min-height: 12rem;
  padding: 1.6rem var(--pad-x);
  background: var(--color-surface);
  text-decoration: none;
}
.z-invite-ways span {
  color: var(--color-sapphire);
  font-size: .68rem;
  letter-spacing: .14em;
}
.z-invite-ways strong {
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 200;
  letter-spacing: -.04em;
}
.z-invite-ways a:hover { background: var(--color-panel); }
.z-invite-ways a:hover strong { font-style: italic; }

@media (min-width: 48rem) {
  .z-invite-hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: start;
  }
  .z-offer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .z-invite-cast {
    grid-template-columns: minmax(12rem, .8fr) minmax(0, 1.2fr);
    gap: 3rem;
    align-items: start;
  }
  .z-invite-ways { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 72rem) {
  .z-offer { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .z-invite-prose { margin-top: .4rem; }
}

/* —— One editorial voice —— */
.ed-say,
.ed-read,
.ed-quote,
.ed-aside,
.ed-verse,
.ed-index,
.ed-reply,
.ed-list,
.ed-cast {
  padding-inline: var(--pad-x);
}
.ed-say {
  max-width: 14ch;
  margin: clamp(3.2rem, 9vw, 6.5rem) auto clamp(1.4rem, 3vw, 2.2rem) var(--pad-x);
  font-size: clamp(1.7rem, 4.4vw, 3.1rem);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.045em;
}
.ed-say--pair { max-width: none; margin-bottom: .8rem; }
.ed-say--nested {
  margin: 0 0 1.2rem;
  font-size: clamp(1.45rem, 3.2vw, 2.3rem);
}
.ed-thin {
  margin: 0 0 .35em;
  font-size: clamp(1.5rem, 3.6vw, 2.6rem);
  font-weight: 200;
  line-height: 1.05;
  letter-spacing: -.04em;
  max-width: 14ch;
}
.ed-strong {
  margin: 0;
  font-size: clamp(1.8rem, 4.8vw, 3.4rem);
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.05em;
  max-width: 14ch;
}
.ed-read {
  max-width: 38rem;
  margin: 0 var(--pad-x) clamp(2rem, 5vw, 3.2rem);
}
.ed-read p {
  margin: 0 0 1rem;
  font-size: 1.22rem;
  font-weight: 400;
  line-height: 1.5;
}
.ed-read p:last-child { margin-bottom: 0; }
.ed-read--soft {
  margin-top: clamp(1.5rem, 4vw, 2.8rem);
  color: var(--color-muted);
}
.ed-quote {
  display: block;
  max-width: 22rem;
  margin: clamp(3.5rem, 11vw, 7.5rem) auto;
  padding: .2rem 0 .2rem 1.15rem;
  font-size: clamp(1.55rem, 3.8vw, 2.7rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.14;
  letter-spacing: -.035em;
  text-align: left;
  border: 0;
  border-left: 2px solid var(--color-gold);
}
.ed-aside {
  max-width: 28ch;
  margin: 0 var(--pad-x) clamp(3rem, 8vw, 5.5rem) auto;
  color: var(--color-muted);
  font-size: .98rem;
  line-height: 1.4;
}
.ed-verse {
  max-width: 18ch;
  margin: clamp(2.5rem, 7vw, 5rem) var(--pad-x);
  font-size: clamp(1.35rem, 2.8vw, 2rem);
  font-weight: 200;
  line-height: 1.28;
  letter-spacing: -.03em;
}
.ed-index {
  display: grid;
  position: relative;
  margin: clamp(2.5rem, 7vw, 5rem) 0;
}
.ed-index:not(.ed-index--three)::before {
  content: '';
  position: absolute;
  left: calc(var(--pad-x) + .42rem);
  top: 1.7rem;
  bottom: 1.7rem;
  width: 1px;
  background: color-mix(in srgb, var(--color-sapphire) 32%, transparent);
}
.ed-index a {
  display: grid;
  gap: .25rem;
  padding: 1.15rem var(--pad-x);
  text-decoration: none;
  transition: transform .2s ease-out;
}
.ed-index a:hover { transform: translateX(.2rem); }
.ed-index i {
  font-style: normal;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
  color: var(--color-sapphire);
  transition: box-shadow .2s ease-out;
}
.ed-index a:hover i {
  box-shadow: inset 0 -.18em 0 var(--color-gold);
}
.ed-index strong {
  font-size: clamp(2rem, 5.4vw, 4.4rem);
  font-weight: 200;
  letter-spacing: -.055em;
  line-height: .9;
}
.ed-index span {
  max-width: 28ch;
  color: var(--color-muted);
  font-size: .98rem;
  line-height: 1.35;
}
.ed-index a:hover strong {
  font-style: italic;
  box-shadow: inset 0 -.12em 0 var(--color-gold);
}
.ed-index--three { margin-bottom: clamp(3rem, 8vw, 6rem); }
.ed-index--three strong { font-size: clamp(1.5rem, 3vw, 2.3rem); }

.ed-reply {
  display: grid;
  gap: .45rem;
  margin: clamp(2.2rem, 6vw, 4rem) var(--pad-x);
  max-width: 28rem;
}
.ed-reply p { margin: 0; max-width: 32ch; }
.ed-reply .button,
.ed-reply .z-button { margin-top: .85rem; justify-self: start; }

.ed-list {
  display: grid;
  gap: 1.4rem 2rem;
  margin: clamp(1.5rem, 4vw, 2.5rem) var(--pad-x) clamp(2.5rem, 6vw, 4rem);
}
.ed-list a { text-decoration: none; }
.ed-list strong {
  display: block;
  margin-bottom: .2rem;
  font-size: 1.15rem;
  font-weight: 500;
  letter-spacing: -.02em;
}
.ed-list span {
  color: var(--color-muted);
  font-size: .95rem;
  line-height: 1.35;
}
.ed-list a:hover strong {
  font-style: italic;
  box-shadow: inset 0 -.12em 0 var(--color-gold);
}
.ed-list a { color: inherit; }
.ed-list a strong { color: var(--color-sapphire); }

.ed-cast {
  display: grid;
  gap: 1.4rem;
  margin: clamp(2rem, 6vw, 4rem) 0;
}
.ed-cast ul {
  margin: 0;
  padding: 0 var(--pad-x);
  list-style: none;
  font-size: clamp(1.25rem, 2.5vw, 1.9rem);
  font-weight: 200;
  line-height: 1.22;
  letter-spacing: -.03em;
}

@media (min-width: 48rem) {
  .ed-read { margin-left: 22%; }
  .z-brief .ed-read { margin-left: 0; }
  .ed-read--soft { margin-left: 30%; }
  .ed-verse { margin-left: 18%; }
  .ed-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ed-cast {
    grid-template-columns: minmax(12rem, .85fr) minmax(0, 1.15fr);
    align-items: start;
    gap: 2rem;
  }
  .ed-index a {
    grid-template-columns: 2.4rem minmax(0, .8fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: end;
  }
  .ed-index--three a { grid-template-columns: 2.4rem 1fr; }
}

@media (min-width: 72rem) {
  .ed-read { margin-left: 28%; max-width: 36rem; }
  .ed-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .z-brief .ed-read { margin-left: 0; max-width: 52rem; }
}

/* —— Proof / reife —— */
.z-proof { padding: clamp(4.5rem, 12vw, 9rem) 0 clamp(5rem, 14vw, 10rem); }
.z-proof-open {
  padding: 0 var(--pad-x) clamp(3rem, 8vw, 6rem);
}
.z-start .z-proof-open h2 {
  max-width: 13ch;
  margin: 0 0 2rem;
  font-size: clamp(2.1rem, 5.8vw, 4.2rem);
  font-weight: 500;
  line-height: .96;
}
.z-proof-lead { max-width: 42rem; }
.z-proof-lead p {
  max-width: 38rem;
  margin: 0 0 1rem;
  font-size: 1.2rem;
  line-height: 1.5;
}
.z-proof-lead p:last-child { margin-bottom: 0; }

.z-proof-gates {
  margin: 0 0 clamp(5rem, 14vw, 10rem);
  padding: clamp(3rem, 8vw, 5.5rem) var(--pad-x);
  list-style: none;
}
.z-proof-gates li {
  position: relative;
  max-width: 16ch;
  margin: 0 auto 1.1rem;
  padding-top: 1rem;
  font-size: clamp(1.7rem, 4.4vw, 3.2rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.12;
  letter-spacing: -.04em;
  text-align: center;
}
.z-proof-gates li::before {
  content: '';
  display: block;
  width: .35rem;
  height: .35rem;
  margin: 0 auto .7rem;
  background: var(--color-sapphire);
  border-radius: 50%;
}
.z-proof-gates li:last-child { margin-bottom: 0; }

.z-phase {
  display: grid;
  gap: 2rem;
  padding: 0 var(--pad-x) clamp(5rem, 12vw, 9rem);
}
.z-phase-kicker {
  margin: 0 0 .7rem;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--color-sapphire);
}
.z-start .z-phase-head h3 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(1.9rem, 4.4vw, 3.2rem);
  font-weight: 500;
  line-height: 1.02;
}
.z-phase-sub {
  margin: .7rem 0 0;
  color: var(--color-muted);
  font-size: 1rem;
}
.z-phase-body {
  margin: 0;
  max-width: 38rem;
}
.z-phase-body > div { padding: 1.6rem 0; }
.z-phase-body dt {
  margin: 0 0 .45rem;
  color: var(--color-muted);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.z-phase-body dd {
  margin: 0;
  max-width: 38rem;
  font-size: 1.2rem;
  line-height: 1.5;
}
.z-phase-gate {
  margin-top: 1rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-gold);
}
.z-phase-gate dd {
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  font-weight: 400;
  font-style: italic;
  line-height: 1.28;
  letter-spacing: -.03em;
}

.z-proof-end {
  max-width: 16ch;
  margin: 0 auto;
  padding: clamp(3rem, 10vw, 7rem) var(--pad-x) 0;
  font-size: clamp(1.7rem, 4.2vw, 3rem);
  font-weight: 200;
  line-height: 1.12;
  letter-spacing: -.04em;
  text-align: center;
}

@media (min-width: 56rem) {
  .z-phase {
    grid-template-columns: minmax(14rem, .8fr) minmax(0, 1.2fr);
    gap: clamp(2.5rem, 6vw, 6rem);
    align-items: start;
  }
  .z-proof-open {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
    gap: 3rem;
    align-items: end;
  }
  .z-start .z-proof-open h2 { margin-bottom: 0; }
}

@media (min-width: 48rem) {
  .z-insert-grid {
    grid-template-columns: minmax(12rem, .8fr) minmax(0, 1.2fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: start;
  }
  .z-essay-copy { margin-left: 22%; }
  .z-logic-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 3rem; }
  .z-split { grid-template-columns: minmax(12rem, .85fr) minmax(0, 1.15fr); gap: 3rem; }
}

@media (min-width: 72rem) {
  .z-essay-copy { margin-left: 30%; max-width: 44ch; }
  .z-logic-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .z-chapter {
    grid-template-columns: 3.2rem minmax(0, 1fr) minmax(0, .9fr);
    gap: 2rem;
    align-items: end;
    padding-block: 3.4rem;
  }
  .z-chapter p { margin-bottom: .55rem; }
}

/* —— Start overview —— */
.z-start,
.z-brief {
  min-width: 0;
  max-width: 100%;
}
.z-brief { padding: 0 0 clamp(2rem, 5vw, 3.5rem); }
.z-map-wrap {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: clamp(2rem, 6vw, 4rem) 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
}
.z-map {
  box-sizing: border-box;
  width: 58rem;
  min-width: 58rem;
  padding: .4rem var(--pad-x) 1.2rem;
}
.z-map-areas {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  margin: 0 0 .7rem;
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.z-map-areas span { white-space: nowrap; }
.z-map-areas span:nth-child(1) { grid-column: 1 / 4; }
.z-map-areas span:nth-child(2) { grid-column: 4 / 6; }
.z-map-areas span:nth-child(3) { grid-column: 6 / 9; }
.z-map-flow {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  margin: 0;
  padding: 0;
  list-style: none;
}
.z-map-flow li {
  position: relative;
  box-sizing: border-box;
  flex: 1 0 0;
  min-width: 0;
  min-height: 4.4rem;
  padding: .35rem .55rem 0 0;
  font-size: .92rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
  scroll-snap-align: start;
}
.z-map-flow li + li {
  padding-left: .7rem;
  box-shadow: inset 1px 0 0 color-mix(in srgb, var(--color-sapphire) 35%, transparent);
}
.z-map-flow li + li::before {
  content: '';
  position: absolute;
  left: -.55rem;
  top: .7rem;
  width: .4rem;
  height: .4rem;
  border-top: 1px solid var(--color-sapphire);
  border-right: 1px solid var(--color-sapphire);
  transform: rotate(45deg);
}
.z-map-flow .is-impact { box-shadow: inset 0 -.18em 0 var(--color-gold); }
.z-map-with {
  margin: 1.1rem 0 0;
  padding: .7rem var(--pad-x) 0;
  border-top: 1px solid color-mix(in srgb, var(--color-sapphire) 28%, transparent);
  color: var(--color-muted);
  font-size: .82rem;
  letter-spacing: -.01em;
}
.z-map-with span {
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.z-map--radar {
  width: 64rem;
  min-width: 64rem;
}
.z-map--radar .z-map-areas,
.z-map--radar .z-map-ex {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.z-map--radar .z-map-areas span:nth-child(1),
.z-map--radar .z-map-ex span:nth-child(1) { grid-column: 1 / 4; }
.z-map--radar .z-map-areas span:nth-child(2),
.z-map--radar .z-map-ex span:nth-child(2) { grid-column: 4 / 7; }
.z-map--radar .z-map-areas span:nth-child(3),
.z-map--radar .z-map-ex span:nth-child(3) { grid-column: 7 / 8; }
.z-map-ex {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  margin: .85rem 0 0;
  padding-top: .65rem;
  border-top: 1px solid color-mix(in srgb, var(--color-sapphire) 22%, transparent);
  color: var(--color-muted);
  font-size: .82rem;
  line-height: 1.3;
  letter-spacing: -.01em;
}

.z-topics { margin: clamp(2.5rem, 7vw, 4.5rem) 0; }
.z-topic-groups {
  display: grid;
  gap: 2rem 2.4rem;
  padding-inline: var(--pad-x);
}
.z-topic-groups h3 {
  margin: 0 0 .55rem;
  max-width: none;
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.z-topic-groups ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.z-topic-groups li {
  padding: .4rem 0;
  font-size: 1.12rem;
  font-weight: 400;
  letter-spacing: -.02em;
  border-bottom: 1px solid var(--color-line);
}

.z-pillars {
  display: grid;
  gap: 2rem 1.6rem;
  margin: clamp(2.2rem, 6vw, 4rem) var(--pad-x);
}
.z-pillar,
.z-pillar a { display: grid; gap: .45rem; }
.z-pillar a { text-decoration: none; color: inherit; }
.z-pillar span {
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
}
.z-start .z-pillar h3 {
  margin: 0;
  max-width: none;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 500;
  letter-spacing: -.03em;
}
.z-pillar-lead { margin: 0; font-size: 1.18rem; line-height: 1.3; }
.z-pillar p { margin: 0; max-width: 38ch; font-size: 1.08rem; line-height: 1.42; color: var(--color-muted); }
.z-pillar-note { color: inherit !important; font-style: italic; }
.z-pillar a:hover h3 { color: var(--color-sapphire); }

.z-actions--brief {
  margin: clamp(2.5rem, 6vw, 4rem) var(--pad-x) clamp(2rem, 5vw, 3.5rem);
}
.z-more {
  display: flex;
  margin: clamp(1.5rem, 4vw, 2.5rem) var(--pad-x) 0;
  font-size: 1rem;
}
#mehr-lesen { padding-top: clamp(9.6rem, 27vw, 19.5rem); }
#mehr-lesen > .z-section:first-child { padding-top: 0; }

.z-brief .ed-say,
.z-brief .ed-read,
.z-brief .ed-aside,
.z-brief .z-actions--brief,
.z-brief .z-more,
.z-brief .z-pillars,
.z-brief .z-topic-groups {
  margin-left: 0;
  margin-right: 0;
  padding-inline: var(--pad);
  max-width: none;
}
.z-brief .ed-quote {
  margin-left: var(--pad);
  margin-right: var(--pad);
}
.z-brief .ed-read { max-width: 52rem; }
.z-brief .ed-say--wide { max-width: none; }

@media (max-width: 1279px) {
  .zukunft-app { overflow-x: visible; }
  .z-map-wrap {
    padding-left: var(--pad);
    scroll-padding-inline: var(--pad);
  }
  .z-map-wrap::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 2.2rem;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, var(--color-surface));
    z-index: 1;
  }
  .z-map {
    display: flex;
    flex-direction: column;
    width: max-content;
    min-width: 0;
    max-width: none;
    padding: .4rem 2.4rem 1.2rem 0;
  }
  .z-map-areas {
    display: flex;
    flex-wrap: nowrap;
    grid-template-columns: none;
    width: max-content;
  }
  .z-map-areas span {
    flex: 0 0 auto;
    grid-column: auto;
  }
  .z-map-areas span:nth-child(1) { width: calc(3 * 72vw); }
  .z-map-areas span:nth-child(2) { width: calc(2 * 72vw); }
  .z-map-areas span:nth-child(3) { width: calc(3 * 72vw); }
  .z-map-flow {
    width: max-content;
  }
  .z-map-flow li {
    flex: 0 0 72vw;
    width: 72vw;
    max-width: 72vw;
    min-height: 5.2rem;
    font-size: 1.15rem;
  }
  .z-map-ex {
    display: flex;
    flex-wrap: nowrap;
    width: max-content;
    grid-template-columns: none;
  }
  .z-map-ex span { flex: 0 0 auto; grid-column: auto; }
  .z-map-ex span:nth-child(1) { width: calc(3 * 72vw); }
  .z-map-ex span:nth-child(2) { width: calc(2 * 72vw); }
  .z-map-ex span:nth-child(3) { width: calc(3 * 72vw); }
  .z-map--radar .z-map-areas span:nth-child(1),
  .z-map--radar .z-map-ex span:nth-child(1) { width: calc(3 * 72vw); }
  .z-map--radar .z-map-areas span:nth-child(2),
  .z-map--radar .z-map-ex span:nth-child(2) { width: calc(3 * 72vw); }
  .z-map--radar .z-map-areas span:nth-child(3),
  .z-map--radar .z-map-ex span:nth-child(3) { width: 72vw; }
  .z-map-with {
    margin-left: var(--pad);
    margin-right: var(--pad);
    padding-left: 0;
    padding-right: 0;
    width: auto;
  }
}

@media (min-width: 48rem) {
  .z-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.4rem 2.8rem; }
  .z-topic-groups { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 72rem) {
  .z-pillars { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ==========================================================================
   Article Magazine Layout Adaptation in Zukunft Design Tokens
   Preserving all Zukunft colors (Carbon, Porcelain, Sapphire, Gold)
   ========================================================================== */

.zukunft-app .detail-hero--article {
  min-height: 90svh;
  background: var(--color-carbon);
  color: var(--color-porcelain);
  padding: clamp(8rem, 15vw, 13rem) var(--pad-x) clamp(3rem, 6vw, 5rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
  overflow: hidden;
}

.zukunft-app .detail-hero--article h1 {
  font-size: clamp(3.6rem, 9.4vw, 10.5rem);
  line-height: .76;
  letter-spacing: -.075em;
  font-weight: 200;
  max-width: 14ch;
  margin: .25em 0 .3em;
  color: var(--color-porcelain);
}

.zukunft-app .detail-hero--article .detail-lead {
  font-size: clamp(1.4rem, 2.4vw, 2.6rem);
  line-height: 1.08;
  max-width: 38ch;
  color: var(--color-porcelain);
  font-weight: 300;
  margin: 0 0 1.5rem;
}

.zukunft-app .detail-index {
  position: absolute;
  right: var(--pad-x);
  top: 10%;
  font-size: clamp(8rem, 25vw, 25rem);
  line-height: .7;
  color: var(--color-sapphire);
  font-weight: 700;
  opacity: .75;
  pointer-events: none;
  font-family: N27, sans-serif;
  font-style: italic;
}

.zukunft-app .article-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: min(100%, 70rem);
  margin: clamp(2rem, 4vw, 4rem) 0 0;
  border-top: 1px solid rgba(248, 248, 245, .2);
}

.zukunft-app .article-meta > div {
  padding: 1rem 1rem 0 0;
  border-right: 1px solid rgba(248, 248, 245, .15);
}

.zukunft-app .article-meta > div + div {
  padding-left: 1rem;
}

.zukunft-app .article-meta > div:last-child {
  border-right: 0;
}

.zukunft-app .article-meta dt {
  color: var(--color-gold);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.zukunft-app .article-meta dd {
  margin: .5rem 0 0;
  font-size: clamp(.85rem, 1.15vw, 1.05rem);
  line-height: 1.35;
  color: var(--color-porcelain);
}

/* Service TL;DR in Zukunft Sapphire */
.zukunft-app .service-tldr {
  display: grid;
  grid-template-columns: minmax(8rem, .58fr) minmax(0, 1.42fr);
  gap: clamp(2rem, 7vw, 9rem);
  padding: clamp(4rem, 9vw, 9rem) var(--pad-x);
  background: var(--color-sapphire);
  color: var(--color-porcelain);
  position: relative;
  overflow: hidden;
}

.zukunft-app .tldr-mark {
  font-size: clamp(5rem, 16vw, 18rem);
  line-height: .68;
  letter-spacing: -.09em;
  font-weight: 700;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  justify-self: start;
  color: var(--color-porcelain);
  opacity: .18;
}

.zukunft-app .tldr-copy {
  max-width: 72rem;
}

.zukunft-app .tldr-copy .kicker {
  color: var(--color-gold);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .72rem;
  font-weight: 700;
}

.zukunft-app .tldr-copy h2 {
  font-size: clamp(3rem, 7.5vw, 8.5rem);
  line-height: .8;
  letter-spacing: -.065em;
  font-weight: 200;
  margin: .25em 0 .55em;
  max-width: 14ch;
  color: var(--color-porcelain);
}

.zukunft-app .tldr-copy > p {
  max-width: 63ch;
  font-size: clamp(1.08rem, 1.65vw, 1.45rem);
  line-height: 1.4;
  margin: 0 0 1.2em;
  color: var(--color-porcelain);
}

.zukunft-app .tldr-summary {
  font-size: clamp(1.35rem, 2.5vw, 2.6rem) !important;
  line-height: 1.08;
  letter-spacing: -.03em;
  margin-top: 1.8em !important;
  max-width: 38ch !important;
  color: var(--color-porcelain);
}

.zukunft-app .tldr-summary strong {
  font-weight: 700;
  color: var(--color-gold);
}

.zukunft-app .tldr-jump {
  display: inline-block;
  margin-top: 2rem;
  border-bottom: 1px solid currentColor;
  padding-bottom: .25rem;
  text-transform: uppercase;
  font-size: .75rem;
  letter-spacing: .12em;
  color: var(--color-porcelain);
  transition: color .2s, border-color .2s;
}

.zukunft-app .tldr-jump:hover {
  color: var(--color-gold);
  border-color: var(--color-gold);
}

/* Service Longform Article Area */
.zukunft-app .service-longform {
  padding: clamp(5rem, 10vw, 10rem) var(--pad-x);
  background: var(--color-surface);
  color: var(--color-text);
}

.zukunft-app .article-layout {
  display: grid;
  grid-template-columns: minmax(14rem, .45fr) minmax(0, 1.55fr);
  gap: clamp(3rem, 8vw, 10rem);
  align-items: start;
  max-width: var(--content);
  margin-inline: auto;
}

.zukunft-app .article-toc {
  position: sticky;
  top: calc(var(--header-offset) + 2rem);
  max-height: calc(100svh - 8rem);
  overflow: auto;
  padding-right: 1.2rem;
}

.zukunft-app .article-toc .kicker {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 700;
  color: var(--color-sapphire);
}

.zukunft-app .article-toc nav {
  display: grid;
  margin-top: 1.25rem;
  border-top: 1px solid var(--color-line);
}

.zukunft-app .article-toc a {
  display: grid;
  grid-template-columns: 2.2rem 1fr;
  gap: .6rem;
  padding: .75rem 0;
  border-bottom: 1px solid var(--color-line);
  font-size: .88rem;
  line-height: 1.25;
  color: var(--color-text);
  text-decoration: none;
  transition: color .2s;
}

.zukunft-app .article-toc a span {
  color: var(--color-sapphire);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
}

.zukunft-app .article-toc a:hover {
  color: var(--color-sapphire);
  font-style: italic;
}

.zukunft-app .article-content {
  min-width: 0;
}

.zukunft-app .article-opening {
  max-width: 32ch;
  margin: 0 0 clamp(4rem, 8vw, 8rem);
  font-size: clamp(1.7rem, 3.5vw, 3.8rem);
  line-height: 1.02;
  letter-spacing: -.045em;
  font-weight: 300;
  color: var(--color-text);
}

.zukunft-app .article-opening p {
  max-width: none;
  margin: 0 0 .65em;
}

.zukunft-app .article-content h2 {
  font-size: clamp(2.8rem, 6.5vw, 7.5rem);
  line-height: .82;
  letter-spacing: -.065em;
  font-weight: 200;
  margin: 1.6em 0 .45em;
  scroll-margin-top: calc(var(--header-offset) + 4rem);
  color: var(--color-text);
}

.zukunft-app .article-content h3 {
  font-size: clamp(1.6rem, 3vw, 3.4rem);
  line-height: .94;
  letter-spacing: -.04em;
  font-weight: 500;
  margin: 2em 0 .6em;
  scroll-margin-top: calc(var(--header-offset) + 4rem);
  color: var(--color-text);
}

.zukunft-app .article-content p,
.zukunft-app .article-content li {
  max-width: 68ch;
  font-size: 1.12rem;
  line-height: 1.5;
}

.zukunft-app .article-content p {
  margin: 0 0 1.4em;
}

.zukunft-app .article-content ul,
.zukunft-app .article-content ol {
  max-width: 68ch;
  padding-left: 1.35em;
  margin: 0 0 2rem;
}

.zukunft-app .article-content li {
  padding: .25em 0;
}

/* Perspective Box in Zukunft Styling */
.zukunft-app .zukunft-perspective {
  position: relative;
  max-width: 68ch;
  margin: clamp(3rem, 6vw, 6rem) 0;
  padding: clamp(1.8rem, 3.5vw, 3.5rem);
  border: 1px solid var(--color-sapphire);
  background: color-mix(in srgb, var(--color-sapphire) 6%, var(--color-surface));
  overflow: hidden;
}

.zukunft-app .zukunft-perspective:after {
  content: "z.";
  position: absolute;
  right: -.05em;
  bottom: -.25em;
  color: color-mix(in srgb, var(--color-sapphire) 10%, transparent);
  font-size: clamp(8rem, 18vw, 15rem);
  font-weight: 100;
  font-style: italic;
  line-height: 1;
  letter-spacing: -.08em;
  pointer-events: none;
  font-family: N27, sans-serif;
}

.zukunft-app .zukunft-perspective > span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  color: var(--color-sapphire);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.zukunft-app .zukunft-perspective > span:before {
  content: "";
  width: .85rem;
  height: .85rem;
  background: var(--color-sapphire);
}

.zukunft-app .zukunft-perspective p {
  position: relative;
  z-index: 1;
  margin: 1.2rem 0 0;
  font-size: clamp(1.25rem, 2.1vw, 2rem);
  line-height: 1.18;
  letter-spacing: -.02em;
  max-width: 45ch;
  color: var(--color-text);
}

/* Article Insight in Zukunft Colors */
.zukunft-app .article-insight {
  max-width: 68ch;
  margin: clamp(3rem, 6vw, 6rem) 0;
  padding: clamp(1.5rem, 3vw, 2.6rem);
  display: grid;
  grid-template-columns: minmax(6.5rem, .32fr) minmax(0, 1.68fr);
  gap: clamp(1.2rem, 3vw, 3rem);
  align-items: start;
  background: var(--color-carbon);
  color: var(--color-porcelain);
  border-left: .5rem solid var(--color-sapphire);
}

.zukunft-app .article-insight span {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--color-gold);
}

.zukunft-app .article-insight p {
  margin: 0;
  font-size: clamp(1.2rem, 1.9vw, 1.85rem);
  line-height: 1.18;
  letter-spacing: -.025em;
  color: var(--color-porcelain);
}

/* Quote */
.zukunft-app .article-content blockquote.ed-quote {
  margin: 3rem 0;
  padding: 1.5rem clamp(1.4rem, 3vw, 3rem);
  border-left: .45rem solid var(--color-sapphire);
  background: color-mix(in srgb, var(--color-sapphire) 6%, transparent);
  font-size: clamp(1.35rem, 2.3vw, 2.4rem);
  line-height: 1.12;
  letter-spacing: -.025em;
  font-weight: 400;
  max-width: 34ch;
  color: var(--color-text);
}

/* Process Flow */
.zukunft-app .article-process {
  max-width: 72rem;
  display: grid;
  grid-template-columns: repeat(11, auto);
  align-items: center;
  gap: clamp(.45rem, 1vw, 1rem);
  margin: clamp(3rem, 7vw, 7rem) 0;
  padding: clamp(1.4rem, 3vw, 3rem);
  background: var(--color-carbon);
  color: var(--color-porcelain);
  overflow-x: auto;
}

.zukunft-app .article-process > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: clamp(8.5rem, 12.5vw, 12.5rem);
  min-height: 10.5rem;
  padding: 1.1rem;
  border: 1px solid rgba(248, 248, 245, .2);
  background: rgba(255, 255, 255, .03);
}

.zukunft-app .article-process span {
  color: var(--color-gold);
  font-size: .68rem;
  letter-spacing: .12em;
  font-weight: 700;
}

.zukunft-app .article-process strong {
  font-size: clamp(1.15rem, 1.8vw, 1.7rem);
  line-height: .98;
  font-weight: 500;
  color: var(--color-porcelain);
}

.zukunft-app .article-process small {
  font-size: .72rem;
  line-height: 1.3;
  color: #c4c4be;
}

.zukunft-app .article-process i {
  color: var(--color-sapphire);
  font-size: 1.4rem;
  font-style: normal;
}

/* Use Cases / Pillars Grid */
.zukunft-app .article-use-cases {
  max-width: 72rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: clamp(3rem, 6vw, 6rem) 0;
  background: var(--color-line);
  border: 1px solid var(--color-line);
}

.zukunft-app .article-use-case {
  position: relative;
  padding: clamp(1.8rem, 3.5vw, 3.5rem);
  background: var(--color-surface);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.zukunft-app .article-use-case-number {
  position: absolute;
  right: .12em;
  top: -.15em;
  color: color-mix(in srgb, var(--color-sapphire) 14%, transparent);
  font-size: clamp(7rem, 13vw, 13rem);
  font-weight: 700;
  line-height: 1;
  font-family: N27, sans-serif;
  pointer-events: none;
}

.zukunft-app .article-use-case h3 {
  position: relative;
  font-size: clamp(2rem, 3.2vw, 3.6rem);
  line-height: .92;
  max-width: 12ch;
  margin: 0 0 1.5rem;
  color: var(--color-text);
}

.zukunft-app .article-use-case dl {
  position: relative;
  margin: 0;
}

.zukunft-app .article-use-case dl > div {
  padding: .9rem 0;
  border-top: 1px solid var(--color-line);
}

.zukunft-app .article-use-case dt {
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.zukunft-app .article-use-case dd {
  margin: .4rem 0 0;
  font-size: .95rem;
  line-height: 1.45;
  color: var(--color-text);
}

.zukunft-app .article-use-case-link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin-top: 1.5rem;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--color-sapphire) !important;
}

/* Table Wrap */
.zukunft-app .article-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  margin: clamp(2rem, 5vw, 4rem) 0;
  border: 1px solid var(--color-line);
  scrollbar-color: var(--color-sapphire) transparent;
}

.zukunft-app .article-content table {
  width: 100%;
  min-width: 50rem;
  border-collapse: collapse;
  background: var(--color-surface);
  font-size: clamp(.9rem, 1.15vw, 1.02rem);
  line-height: 1.45;
}

.zukunft-app .article-content th,
.zukunft-app .article-content td {
  padding: 1.1rem 1.2rem;
  text-align: left;
  vertical-align: top;
  border-right: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
}

.zukunft-app .article-content thead th {
  background: var(--color-carbon);
  color: var(--color-porcelain);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.zukunft-app .article-content tbody th {
  color: var(--color-sapphire);
  font-weight: 700;
}

/* CTA Section in Zukunft Sapphire */
.zukunft-app .cta--zukunft {
  background: var(--color-sapphire);
  color: var(--color-porcelain);
  min-height: 85svh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--pad-x);
}

.zukunft-app .cta--zukunft .kicker {
  color: var(--color-gold);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.zukunft-app .cta--zukunft h2 {
  font-size: clamp(3.8rem, 11vw, 11rem);
  line-height: .76;
  letter-spacing: -.075em;
  font-weight: 100;
  margin: 6rem 0 2rem;
  max-width: 10ch;
  color: var(--color-porcelain);
}

.zukunft-app .cta--zukunft h2 strong {
  font-weight: 700;
  color: var(--color-porcelain);
}

.zukunft-app .cta--zukunft .cta-row {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 2rem;
}

.zukunft-app .cta--zukunft .lead {
  color: var(--color-porcelain);
  font-size: clamp(1.35rem, 2.4vw, 2.6rem);
  line-height: 1.1;
  max-width: 28ch;
  margin: 0;
}

.zukunft-app .cta--zukunft .pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-porcelain);
  border-radius: 999px;
  min-width: 10rem;
  min-height: 10rem;
  padding: 1rem;
  text-align: center;
  text-transform: uppercase;
  font-size: .75rem;
  letter-spacing: .1em;
  color: var(--color-porcelain);
  text-decoration: none;
  transition: background .3s, color .3s, transform .3s;
}

.zukunft-app .cta--zukunft .pill:hover {
  background: var(--color-carbon);
  color: var(--color-gold);
  border-color: var(--color-carbon);
  transform: rotate(-6deg);
}

@media (max-width: 900px) {
  .zukunft-app .article-layout { grid-template-columns: 1fr; gap: 3rem; }
  .zukunft-app .article-toc { position: relative; top: auto; max-height: none; overflow: visible; padding: 0; }
  .zukunft-app .article-toc nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zukunft-app .article-toc a:nth-child(odd) { padding-right: 1rem; }
  .zukunft-app .article-opening { margin-bottom: 4rem; }
}

@media (max-width: 760px) {
  .zukunft-app .detail-hero--article h1 { font-size: clamp(3.2rem, 15vw, 6rem); max-width: 11ch; }
  .zukunft-app .article-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zukunft-app .article-meta > div { padding-bottom: 1rem; }
  .zukunft-app .article-meta > div:nth-child(2) { border-right: 0; }
  .zukunft-app .article-meta > div:nth-child(3),
  .zukunft-app .article-meta > div:nth-child(4) { border-top: 1px solid rgba(248, 248, 245, .15); }
  .zukunft-app .service-tldr { grid-template-columns: 1fr; gap: 1.5rem; }
  .zukunft-app .tldr-mark { writing-mode: horizontal-tb; transform: none; font-size: clamp(4.5rem, 25vw, 8rem); }
  .zukunft-app .tldr-copy h2 { font-size: clamp(3.1rem, 17vw, 6rem); }
  .zukunft-app .article-use-cases { grid-template-columns: 1fr; }
  .zukunft-app .article-insight { grid-template-columns: 1fr; }
  .zukunft-app .cta--zukunft .cta-row { flex-direction: column; align-items: flex-start; }
  .zukunft-app .cta--zukunft .pill { min-width: 8rem; min-height: 8rem; }
}

@media (max-width: 560px) {
  .zukunft-app .article-toc nav { grid-template-columns: 1fr; }
  .zukunft-app .article-toc a:nth-child(odd) { padding-right: 0; }
  .zukunft-app .article-content h2 { font-size: clamp(2.5rem, 13vw, 4.5rem); }
}

/* —— Landing V2 —— */
.z-land {
  --land-display: clamp(2.5rem, 9.4vw, 5.6rem);
  --land-text: clamp(1.2rem, 2.8vw, 1.7rem);
  --z-content-max: 80rem;
  --z-reading-max: 47.5rem;
  --space-section-small: clamp(4rem, 6vw, 5rem);
  --space-section-medium: clamp(6.25rem, 9vw, 8.1rem);
  --space-section-large: clamp(10rem, 12vw, 12.5rem);
}
.z-land .z-hero .z-actions { margin-top: 2.6rem; }
.z-land .z-lead { max-width: none; }
.z-land-sec { padding: var(--space-section-medium) 0; }
.z-land .ed-read { max-width: var(--z-reading-max); }
.z-land-sec > .z-kicker {
  display: block;
  margin: 0 0 1.25rem;
  padding-inline: var(--pad);
}
.z-land-sec > .z-kicker + .ed-say,
.z-land-sec > .z-kicker + .ed-say--pair {
  margin-top: 0;
}
.z-land .ed-say,
.z-land .ed-read,
.z-land .ed-thin,
.z-land .ed-strong {
  margin-left: 0;
  margin-right: 0;
  padding-inline: var(--pad);
}
.z-land .ed-say,
.z-land .ed-say--wide,
.z-land .ed-strong {
  max-width: none;
  font-size: var(--land-display);
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.055em;
}
.z-land .ed-thin {
  max-width: none;
  font-size: var(--land-display);
  font-weight: 200;
  line-height: .9;
  letter-spacing: -.055em;
}
.z-land .ed-read { max-width: var(--z-reading-max); }
.z-land .ed-read p,
.z-land .z-lane p,
.z-land .z-lane-lead,
.z-land .z-lane-ex,
.z-land .z-who strong,
.z-land .z-who span,
.z-land .z-map-with,
.z-land .z-enter span {
  font-size: var(--land-text);
  font-weight: 400;
  line-height: 1.28;
}
.z-land .z-lane-lead,
.z-land .z-who strong { font-weight: 500; }
.z-land-cta {
  margin: 2rem 0 0;
  padding-inline: var(--pad);
}

.z-map--land {
  width: 62rem;
  min-width: 62rem;
}
.z-map--land .z-map-areas {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  margin: .95rem 0 0;
}
.z-map--land .z-map-areas span:nth-child(1) { grid-column: 1 / 4; }
.z-map--land .z-map-areas span:nth-child(2) { grid-column: 4 / 5; }
.z-map--land .z-map-areas span:nth-child(3) { grid-column: 5 / 8; }

.z-lanes {
  display: grid;
  gap: clamp(3.2rem, 8vw, 6.5rem);
  padding-inline: var(--pad);
}
.z-lane-num,
.z-lane-ctx {
  margin: 0 0 .35rem;
  color: var(--color-sapphire);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.z-lane-ctx { margin-bottom: .55rem; }
.z-areas-note {
  max-width: 36rem;
  margin: 0 0 clamp(1rem, 3vw, 1.6rem);
  padding-inline: var(--pad);
  color: var(--color-muted);
  font-size: var(--land-text);
  line-height: 1.35;
}
.z-land .z-lane h2 {
  margin: 0 0 .4rem;
  max-width: none;
  font-size: var(--land-display);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .9;
}
.z-lane-lead {
  margin: 0 0 1rem;
  letter-spacing: -.03em;
}
.z-lane p { margin: 0 0 .85rem; max-width: 42ch; color: var(--color-muted); }
.z-lane-ex { color: var(--color-muted); letter-spacing: -.01em; }
.z-lane .button,
.z-lane .z-button { margin-top: .35rem; }

.z-who {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 48px;
  row-gap: 36px;
  margin: 0;
  padding: 0 var(--pad);
  list-style: none;
}
.z-land .z-who strong {
  display: block;
  margin-bottom: .35rem;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.z-land .z-who span {
  display: block;
  max-width: 28ch;
  color: var(--color-muted);
  font-size: clamp(.95rem, 1.15vw, 1.08rem);
  line-height: 1.42;
}
@media (min-width: 48rem) {
  .z-who { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 72rem) {
  .z-who { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.z-enter {
  display: grid;
  padding-inline: var(--pad);
}
.z-enter a {
  display: grid;
  gap: .2rem;
  padding: 1.55rem 0;
  text-decoration: none;
  border-top: 1px solid var(--color-line);
  color: inherit;
}
.z-enter a:last-child { border-bottom: 1px solid var(--color-line); }
.z-land .z-enter span {
  color: var(--color-muted);
  font-size: clamp(.95rem, 1.15vw, 1.08rem);
}
.z-enter strong {
  font-size: var(--land-display);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .9;
}
.z-enter a:hover strong {
  font-style: italic;
  color: var(--color-sapphire);
}

@media (max-width: 71.99rem) {
  .z-map--land {
    width: max-content;
    min-width: 0;
  }
  .z-map--land .z-map-areas span:nth-child(1) { width: calc(3 * 72vw); }
  .z-map--land .z-map-areas span:nth-child(2) { width: 72vw; }
  .z-map--land .z-map-areas span:nth-child(3) { width: calc(3 * 72vw); }
  .z-land .ed-say,
  .z-land .ed-read,
  .z-land .ed-thin,
  .z-land .ed-strong,
  .z-land-cta,
  .z-lanes,
  .z-who,
  .z-enter {
    padding-inline: var(--pad);
  }
}
@media (min-width: 48rem) {
  .z-lane {
    display: grid;
    grid-template-columns: 3.2rem minmax(0, 1fr);
    column-gap: 1.6rem;
    align-items: start;
  }
  .z-lane-num { grid-row: 1 / 8; margin: .35rem 0 0; }
  .z-who { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 72rem) {
  .z-who { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* —— Editorial image + color bands —— */
.z-ed {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(18px, 2vw, 32px);
  padding-inline: var(--pad);
}
.z-portrait {
  margin: 0;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--color-panel);
}
.z-portrait img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.z-duo {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(20px, 2vw, 32px);
  align-items: start;
  max-width: var(--z-content-max, 80rem);
  margin: 0 auto;
  padding: 0 var(--pad) clamp(1rem, 3vw, 2rem);
}
.z-duo--uneven { grid-template-columns: 1.15fr .85fr; }
.z-duo--inset { padding-inline: calc(var(--pad) + 3vw); }
.z-duo .z-portrait:last-child { transform: translateY(clamp(18px, 3vw, 48px)); }
.z-split {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(240px, 4fr);
  gap: clamp(40px, 5vw, 80px);
  align-items: center;
  margin: 0;
  padding-block: clamp(56px, 7vw, 100px);
  padding-inline: var(--pad);
}
.z-split + .z-split {
  border-top: 1px solid var(--color-line);
}
#bereiche > .z-split:first-of-type { padding-top: clamp(2rem, 4vw, 3.5rem); }
.z-split--flip { grid-template-columns: minmax(240px, 4fr) minmax(0, 7fr); }
.z-split-copy { min-width: 0; }
.z-split .z-portrait {
  width: 100%;
  max-width: 360px;
  justify-self: end;
}
.z-split--flip .z-portrait { justify-self: start; }
@media (min-width: 90rem) {
  .z-split .z-portrait { max-width: 400px; }
}

.z-frame {
  margin: 0;
  background: var(--color-panel);
}
.z-frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 32%;
}
.z-frame--wide img { object-position: 72% 50%; }
.z-frame--arch img {
  aspect-ratio: 16 / 9;
  height: auto;
  object-position: 52% 62%;
}

@media (max-width: 47.99rem) {
  .z-duo,
  .z-split,
  .z-split--flip {
    grid-template-columns: 1fr;
  }
  .z-duo .z-portrait:last-child { transform: none; }
  .z-split .z-portrait {
    max-width: min(72vw, 300px);
    justify-self: end;
  }
  .z-split--flip .z-portrait {
    order: -1;
    justify-self: start;
  }
}
.z-band {
  padding: clamp(4rem, 11vw, 8.8rem) var(--pad);
  color: var(--color-porcelain);
  background: var(--color-sapphire);
}
.z-band p {
  max-width: 16ch;
  margin: 0;
  font-size: var(--land-display, clamp(2.5rem, 9.4vw, 5.6rem));
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.055em;
}
.z-band .ed-thin,
.z-band .ed-strong {
  max-width: 16ch;
  margin: 0;
  padding-inline: 0;
  color: inherit;
}
.z-band .ed-thin { margin-bottom: .4em; }
.z-band .z-kicker {
  display: block;
  margin: 0 0 1.25rem;
  padding: 0;
  color: inherit;
  opacity: .78;
}
.z-band .button,
.z-band .button,
.z-band .z-button { margin-top: 2.2rem; }
.z-band--gold {
  color: var(--color-carbon);
  background: var(--color-gold);
}
@media (prefers-reduced-motion: reduce) {
  .z-frame img { object-position: center center; }
}

/* —— Entdecken editorial refinement —— */
.z-discover {
  --z-read: 48rem;
  --z-editorial: 70rem;
  --z-full: 80rem;
  --space-s: clamp(3.5rem, 6vw, 4.5rem);
  --space-m: clamp(6rem, 9vw, 7.5rem);
  --space-l: clamp(9.4rem, 12vw, 11.25rem);
}
.z-discover #mehr-lesen { padding-top: var(--space-s); }
.z-discover .z-section { padding-block: var(--space-m); }
.z-discover .z-section--carbon,
.z-discover .z-section--sapphire { padding-block: var(--space-l); }
.z-discover .z-section > * { max-width: var(--z-read); }
.z-discover .z-section--carbon > *,
.z-discover .z-section--sapphire > * { max-width: 54rem; }
.z-discover .z-section h2 { max-width: 16ch; }
.z-discover .z-section .z-land-cta,
.z-discover .z-orient + .z-land-cta {
  margin-top: 2rem;
  padding-inline: 0;
}
.z-discover .z-outcome .z-land-cta { padding-inline: 0; }
.z-discover .z-split-copy h2 {
  margin: 0 0 .7rem;
  max-width: 13ch;
  font-size: clamp(2.2rem, 5.4vw, 4.2rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .92;
}
.z-discover .z-split-copy .z-lane-lead {
  max-width: 36ch;
  font-size: clamp(1.15rem, 2vw, 1.45rem);
  line-height: 1.3;
}

.z-lede {
  display: grid;
  gap: clamp(1.6rem, 4vw, 2.8rem);
  padding-inline: var(--pad);
  margin-bottom: var(--space-s);
}
.z-lede .ed-read,
.z-lede .ed-quote {
  margin: 0;
  padding-inline: 0;
}
.z-lede .ed-quote {
  max-width: 14ch;
  margin: 0;
  font-size: clamp(1.8rem, 4.2vw, 3.2rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.05;
  letter-spacing: -.04em;
}
@media (min-width: 64rem) {
  .z-lede {
    grid-template-columns: minmax(0, 7.5fr) minmax(14rem, 4.5fr);
    align-items: start;
    gap: 3rem 4rem;
    max-width: var(--z-editorial);
  }
}

.z-orient {
  display: grid;
  gap: 2rem 0;
  margin: var(--space-s) var(--pad);
  padding: 0;
  max-width: var(--z-full);
  list-style: none;
}
.z-orient li {
  display: grid;
  gap: .45rem;
  padding: 1.4rem 0;
  border-top: 1px solid var(--color-line);
}
.z-orient-num {
  color: var(--color-sapphire);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .12em;
}
.z-orient h3 {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
  font-weight: 500;
  letter-spacing: -.03em;
  line-height: 1.1;
}
.z-orient p {
  margin: 0;
  max-width: 28ch;
  font-size: 1rem;
  line-height: 1.45;
  color: var(--color-muted);
}
@media (min-width: 48rem) {
  .z-orient {
    grid-template-columns: 1fr 1fr;
    column-gap: 2.4rem;
  }
}
@media (min-width: 72rem) {
  .z-orient {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 2.6rem;
  }
  .z-orient li {
    padding: 1.6rem 1.4rem 0 0;
    border-top: 0;
    border-right: 1px solid var(--color-line);
  }
  .z-orient li:last-child { border-right: 0; padding-right: 0; }
}

.z-discover #themen > .ed-say {
  font-size: clamp(2rem, 4.2vw, 3.2rem);
  line-height: .95;
}
.z-radar {
  margin: var(--space-m) var(--pad) var(--space-s);
  max-width: var(--z-full);
}
.z-radar-grid {
  display: grid;
  gap: 2.2rem 2.4rem;
}
.z-radar h3 {
  margin: 0 0 .85rem;
  padding-bottom: .55rem;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--color-sapphire);
}
.z-radar ul { margin: 0; padding: 0; list-style: none; }
.z-radar li {
  padding: .7rem 0 .7rem 1rem;
  font-size: 1.12rem;
  letter-spacing: -.02em;
  border-bottom: 1px solid var(--color-line);
  background-image: linear-gradient(var(--color-sapphire), var(--color-sapphire));
  background-size: 4px 4px;
  background-repeat: no-repeat;
  background-position: 0 .95rem;
}
@media (min-width: 48rem) {
  .z-radar-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 72rem) {
  .z-radar-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 3rem; }
}

.z-outcome {
  margin: var(--space-s) var(--pad) 0;
  max-width: var(--z-read);
  padding-top: 1.6rem;
  border-top: 1px solid var(--color-line);
}
.z-outcome .ed-say,
.z-outcome .ed-read,
.z-outcome .z-actions {
  margin-left: 0;
  margin-right: 0;
  padding-inline: 0;
}
.z-outcome .ed-say { margin-top: 0; margin-bottom: 1rem; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.z-outcome .ed-read { margin-bottom: 1.4rem; }
.z-outcome ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 1.12rem;
  line-height: 1.5;
}

.z-compare {
  width: 100%;
  max-width: var(--z-editorial) !important;
  margin: 2rem 0 0;
  border-collapse: collapse;
}
.z-compare caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.z-compare th,
.z-compare td {
  width: 50%;
  padding: 1.05rem 1.2rem 1.05rem 0;
  text-align: left;
  vertical-align: top;
  font-size: 1.12rem;
  font-weight: 400;
  line-height: 1.4;
  border-bottom: 1px solid var(--color-line);
}
.z-compare th { font-size: .72rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--color-muted); }
.z-compare td:first-child { color: var(--color-muted); padding-right: 1.6rem; }
.z-compare td:last-child { color: var(--color-text); }

.z-roles {
  width: 100%;
  max-width: none;
  margin: 1.6rem 0 0;
  border-collapse: collapse;
}
.z-roles th,
.z-roles td {
  padding: 1rem 1.1rem 1rem 0;
  text-align: left;
  vertical-align: top;
  font-size: 1.05rem;
  line-height: 1.45;
  border-bottom: 1px solid var(--color-line);
}
.z-roles th { width: 34%; font-weight: 500; letter-spacing: -.02em; }
.z-roles thead th {
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--color-muted);
}

.z-discover .z-section--sapphire h2 { max-width: 16ch; margin-bottom: 1.4rem; }
.z-discover .z-section--sapphire .z-intro { margin-bottom: 0; }
.z-discover .z-flow { display: none; }

.z-close {
  padding: var(--space-m) var(--pad);
  max-width: var(--z-read);
}
.z-close .ed-say { margin: 0 0 1.2rem; padding: 0; font-size: clamp(1.6rem, 3vw, 2.4rem); }

@media (max-width: 47.99rem) {
  .z-orient li { padding-block: 1.2rem; }
  .z-compare th,
  .z-compare td,
  .z-roles th,
  .z-roles td { display: block; width: 100%; padding-right: 0; }
  .z-compare td:first-child { border-bottom: 0; padding-bottom: .2rem; }
}

/* —— Lernen editorial refinement —— */
.z-learn {
  --z-read: 48rem;
  --z-editorial: 70rem;
  --z-full: 80rem;
  --space-s: clamp(3.5rem, 6vw, 4.5rem);
  --space-m: clamp(6rem, 8vw, 7.5rem);
  --space-l: clamp(9.4rem, 11vw, 11.25rem);
}
.z-learn .z-frame--tall img {
  aspect-ratio: 4 / 3;
  object-position: 72% 28%;
}
.z-learn .z-section { padding-block: var(--space-m); }
.z-learn .z-section--carbon { padding-block: var(--space-l); }
.z-learn .z-section--sapphire { padding-block: clamp(7.5rem, 9vw, 9rem); }
.z-learn .z-section--gold { padding-block: var(--space-m); }
.z-learn .z-section > * { max-width: var(--z-read); }
.z-learn .z-section--carbon > *,
.z-learn .z-section--sapphire > *,
.z-learn .z-section--gold > * { max-width: 51.25rem; }
.z-learn .z-section h2 { max-width: 16ch; }
.z-learn .z-section--gold h2 { max-width: 14ch; }
.z-learn .z-section .z-land-cta,
.z-learn .z-land-cta {
  margin-top: 2rem;
  padding-inline: 0;
}
.z-learn .z-path {
  max-width: 51.25rem;
  margin-block: 2.6rem 1.6rem;
}
.z-learn .z-path li {
  min-height: 5rem;
  padding: 1.35rem 0 1.35rem 3.8rem;
  line-height: 1.55;
}
.z-learn .z-path li::before { top: 1.15rem; }
.z-learn .z-path strong {
  margin-bottom: .25rem;
  font-size: 1.12rem;
}

.z-learn-academy {
  align-items: start;
  max-width: var(--z-editorial);
  margin-inline: auto;
  padding-block: var(--space-m);
  gap: clamp(48px, 6vw, 96px);
  grid-template-columns: minmax(0, 7fr) minmax(280px, 4fr);
}
.z-learn-academy .z-split-copy h2 {
  margin: 0 0 .7rem;
  max-width: 13ch;
  font-size: clamp(2.2rem, 5.4vw, 4.2rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .92;
}
.z-learn-academy .z-lane-lead {
  max-width: 28ch;
  margin: 0 0 1.5rem;
  font-size: clamp(1.4rem, 2.6vw, 1.95rem);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -.03em;
}
.z-learn-academy .ed-read {
  margin: 0 0 2.2rem;
  padding-inline: 0;
  max-width: 40rem;
}
.z-learn-academy .ed-read p {
  font-size: 1.08rem;
  line-height: 1.5;
}
.z-learn-academy .z-portrait {
  max-width: min(100%, 22rem);
  justify-self: end;
}
.z-learn-academy .z-portrait img { object-position: 100% 48%; }

.z-academy {
  display: grid;
  gap: 1.6rem 2rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--color-line);
}
.z-academy h3 {
  margin: 0 0 .45rem;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.z-academy p {
  margin: 0;
  max-width: 32ch;
  font-size: 1.05rem;
  line-height: 1.45;
}
@media (min-width: 48rem) {
  .z-academy { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.z-learn .z-band p { max-width: 18ch; }

.z-learn #playbook > * {
  margin-inline: 0;
  max-width: 51.25rem;
}

.z-learn-photo {
  display: grid;
  justify-items: stretch;
  max-width: none;
  margin: 0 0 var(--space-s);
  padding-inline: 0;
}
.z-learn #playbook + .z-learn-photo {
  margin-top: 0;
}
.z-learn-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: 48% 72%;
}
.z-learn-photo figcaption {
  max-width: var(--z-read);
  margin-top: 1.1rem;
  padding-inline: var(--pad);
  font-size: 1.12rem;
  line-height: 1.45;
  color: var(--color-muted);
}

.z-learn-topics { padding-block: var(--space-m); }
.z-learn-topics > .z-kicker { margin-bottom: 1.1rem; }
.z-learn-topics > h2 {
  max-width: 16ch;
  margin: 0 var(--pad) var(--space-s);
  font-size: clamp(2rem, 4.2vw, 3.4rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .95;
}
.z-cluster {
  max-width: var(--z-editorial);
  margin: 0 var(--pad) var(--space-s);
}
h3.z-cluster-title {
  margin: 0 0 1.2rem;
  padding-bottom: .55rem;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .12em;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--color-sapphire);
  border-bottom: 1px solid var(--color-line);
}
.z-cluster-grid {
  display: grid;
  gap: 2.4rem 3rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.z-cluster-grid li {
  min-width: 0;
  padding-top: .2rem;
}
.z-cluster-num {
  display: block;
  margin-bottom: .55rem;
  color: var(--color-sapphire);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .12em;
}
.z-cluster-grid h4 {
  margin: 0 0 .7rem;
  max-width: 18ch;
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  font-weight: 500;
  letter-spacing: -.03em;
  line-height: 1.12;
}
.z-cluster-grid p {
  margin: 0;
  max-width: 38ch;
  font-size: 1.05rem;
  line-height: 1.5;
  color: var(--color-text);
}
.z-cluster-grid .z-topic-route {
  margin-top: .75rem;
  font-size: .88rem;
  color: var(--color-muted);
}
@media (min-width: 48rem) {
  .z-cluster-grid { grid-template-columns: 1fr 1fr; }
}

.z-learn-wide {
  width: 100%;
  margin: var(--space-s) 0;
  padding: 0;
}
.z-learn-wide img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: 52% 38%;
}

.z-learn #versuch {
  max-width: var(--z-editorial);
  margin-inline: auto;
  padding-block: var(--space-m);
  grid-template-columns: minmax(280px, 5.2fr) minmax(0, 5.8fr);
  gap: clamp(40px, 5vw, 72px);
}
.z-learn #versuch .z-portrait {
  max-width: min(100%, 32rem);
  width: 100%;
}
.z-learn #versuch .z-split-copy h2 {
  margin: 0 0 .7rem;
  max-width: 13ch;
  font-size: clamp(2rem, 4.6vw, 3.6rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .94;
}
.z-learn #versuch .z-lane-lead {
  max-width: 34ch;
  margin: 0 0 1.2rem;
  font-size: clamp(1.15rem, 2vw, 1.4rem);
  line-height: 1.3;
}
.z-portrait--wide {
  max-width: min(100%, 28rem);
  aspect-ratio: 4 / 3;
}
.z-learn #versuch .z-portrait--wide { justify-self: start; }

.z-learn-check { padding-block: var(--space-m) var(--space-l); }
.z-learn-check > .z-kicker { margin-bottom: 1.1rem; }
.z-learn-check > h2 {
  max-width: 14ch;
  margin: 0 var(--pad) .8rem;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .95;
}
.z-learn-check > .z-intro {
  max-width: var(--z-read);
  margin: 0 var(--pad) 2rem;
  font-size: 1.15rem;
}
.z-check {
  display: grid;
  gap: 0;
  max-width: var(--z-editorial);
  margin: 0 var(--pad) var(--space-s);
  padding: 0;
  list-style: none;
}
.z-check li {
  display: grid;
  grid-template-columns: 1.4rem 1fr;
  gap: .7rem;
  align-items: start;
  padding: 1rem 0;
  border-top: 1px solid var(--color-line);
  font-size: 1.05rem;
  line-height: 1.4;
}
.z-check li:last-child { border-bottom: 1px solid var(--color-line); }
.z-check .ph {
  margin-top: .15rem;
  color: var(--color-sapphire);
  font-size: 1.1rem;
}
@media (min-width: 48rem) {
  .z-check { grid-template-columns: 1fr 1fr; column-gap: 2.8rem; }
  .z-check li:nth-last-child(2):nth-child(odd) { border-bottom: 1px solid var(--color-line); }
}
.z-learn-check .z-note,
.z-learn-check .z-noscript,
.z-learn-check .pq,
.z-learn-check .z-actions {
  max-width: var(--z-read);
  margin-left: var(--pad);
  margin-right: var(--pad);
}
.z-learn-check .z-note {
  padding: 1rem 0 1rem 1rem;
  background: transparent;
  border-radius: 0;
}
.z-learn-check .z-actions { margin-top: 1.6rem; }

html[data-theme="dark"] h3.z-cluster-title,
html[data-theme="dark"] .z-cluster-num,
html[data-theme="dark"] .z-check .ph {
  color: var(--color-link);
}

@media (max-width: 63.99rem) {
  .z-learn-academy {
    grid-template-columns: 1fr;
    gap: 2.4rem;
  }
  .z-learn-academy .z-portrait {
    max-width: min(85vw, 22rem);
    aspect-ratio: 4 / 3;
    justify-self: end;
  }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .z-learn-academy {
    grid-template-columns: minmax(0, 7fr) minmax(280px, 4fr);
  }
}
@media (max-width: 47.99rem) {
  .z-academy { grid-template-columns: 1fr; }
  .z-cluster-grid { grid-template-columns: 1fr; }
  .z-check { grid-template-columns: 1fr; }
  .z-learn-photo img { width: 100%; }
  .z-learn-wide { margin-block: 2.4rem; }
  .z-learn .z-path li { padding-block: 1.1rem; }
  .z-learn #versuch {
    grid-template-columns: 1fr;
  }
  .z-learn #versuch .z-portrait {
    max-width: min(85vw, 24rem);
  }
}

/* —— Mitmachen editorial refinement —— */
.z-join {
  --z-read: 48rem;
  --z-editorial: 70rem;
  --z-full: 80rem;
  --space-s: clamp(3.5rem, 6vw, 4.5rem);
  --space-m: clamp(6rem, 8vw, 7.5rem);
  --space-l: clamp(9.4rem, 11vw, 11.25rem);
}
.z-join .z-frame--tall img {
  aspect-ratio: 4 / 3;
  object-position: 48% 62%;
}
.z-join .z-section { padding-block: var(--space-m); }
.z-join .z-section--carbon { padding-block: var(--space-l); }
.z-join .z-section--sapphire { padding-block: clamp(7.5rem, 9vw, 9rem); }
.z-join .z-section--gold { padding-block: clamp(5rem, 7vw, 6.4rem); }
.z-join .z-section > * { max-width: var(--z-read); }
.z-join .z-section--carbon > *,
.z-join .z-section--sapphire > *,
.z-join .z-section--gold > * { max-width: 51.25rem; }
.z-join .z-section h2 { max-width: 16ch; }
.z-join .z-section .z-land-cta,
.z-join .z-land-cta {
  margin-top: 2rem;
  padding-inline: 0;
}
.z-join .z-path {
  max-width: 51.25rem;
  margin-block: 2.6rem 1.8rem;
}
.z-join .z-path li {
  min-height: 5rem;
  padding: 1.35rem 0 1.35rem 3.8rem;
  line-height: 1.55;
}
.z-join .z-path li::before { top: 1.15rem; }
.z-join .z-path strong {
  margin-bottom: .25rem;
  font-size: 1.12rem;
}
.z-join #events > * { margin-inline: 0; }

.z-join-community {
  align-items: start;
  max-width: var(--z-editorial);
  margin-inline: auto;
  padding-block: var(--space-m);
  gap: clamp(48px, 6vw, 96px);
  grid-template-columns: minmax(0, 7fr) minmax(280px, 4fr);
}
.z-join-community .z-split-copy h2 {
  margin: 0 0 .7rem;
  max-width: 13ch;
  font-size: clamp(2.2rem, 5.4vw, 4.2rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .92;
}
.z-join-community .z-lane-lead {
  max-width: 28ch;
  margin: 0 0 1.5rem;
  font-size: clamp(1.4rem, 2.6vw, 1.95rem);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -.03em;
}
.z-join-community .ed-read {
  margin: 0 0 2.2rem;
  padding-inline: 0;
  max-width: 40rem;
}
.z-join-community .ed-read p {
  font-size: 1.08rem;
  line-height: 1.5;
}
.z-join-community .z-portrait {
  max-width: min(100%, 22rem);
  justify-self: end;
}
.z-join-community .z-portrait img { object-position: 48% 22%; }

.z-join-quote {
  max-width: 47.5rem;
  margin: var(--space-s) auto;
  padding: 0 var(--pad);
  border: 0;
  font-size: clamp(1.875rem, 3.3vw, 3.625rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.02;
  letter-spacing: -.04em;
}

.z-join-carbon-quote {
  max-width: 28ch;
  margin: 2.4rem 0 0;
  padding: 0;
  border: 0;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.12;
  letter-spacing: -.03em;
}

.z-join-photo {
  display: grid;
  justify-items: start;
  max-width: var(--z-editorial);
  margin: 0 auto var(--space-s);
  padding-inline: var(--pad);
}
.z-join #events + .z-join-photo { margin-top: 0; }
.z-join-photo img {
  display: block;
  width: min(100%, 46rem);
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: 48% 42%;
}

.z-join-space { padding-block: var(--space-m); }
.z-join-space > .z-kicker { margin-bottom: 1.1rem; }
.z-join-space > h2 {
  max-width: 14ch;
  margin: 0 var(--pad) 1.4rem;
  font-size: clamp(2.2rem, 5vw, 4rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .92;
}
.z-join-space > .ed-read {
  margin: 0 var(--pad) var(--space-s);
  padding-inline: 0;
}
.z-join-space > .ed-read p { font-size: 1.12rem; line-height: 1.45; }
.z-join-space .z-frame {
  margin-block: 0 var(--space-s);
}
.z-join-space .z-academy {
  max-width: var(--z-editorial);
  margin: 0 var(--pad);
}
.z-join-space .z-land-cta { padding-inline: var(--pad); }

.z-join-dialog {
  width: min(22rem, 78vw);
  max-width: 360px;
  margin: 0 var(--pad) var(--space-s) auto;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}
.z-join-dialog img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 42% 22%;
}

.z-join #conference .z-academy {
  margin-top: 2.2rem;
  max-width: none;
}
.z-join #conference .z-academy h3 { color: color-mix(in srgb, var(--color-porcelain) 72%, transparent); }
.z-join #conference .z-academy p {
  max-width: 28ch;
  color: var(--color-porcelain);
}
.z-join #conference .z-academy {
  border-top-color: color-mix(in srgb, var(--color-porcelain) 28%, transparent);
}

.z-join #mitwirken {
  max-width: var(--z-editorial);
  margin-inline: auto;
  padding-block: var(--space-m);
  grid-template-columns: minmax(280px, 4fr) minmax(0, 7fr);
  gap: clamp(48px, 6vw, 96px);
}
.z-join #mitwirken .z-portrait {
  max-width: min(100%, 28rem);
  width: 100%;
  aspect-ratio: 4 / 3;
}
.z-join #mitwirken .z-split-copy h2 {
  margin: 0 0 1.2rem;
  max-width: 12ch;
  font-size: clamp(2rem, 4.6vw, 3.6rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .94;
}
.z-join-ways {
  margin: 0;
  padding: 0;
  list-style: none;
  max-width: 36ch;
}
.z-join-ways li {
  padding: .85rem 0 .85rem 1.4rem;
  border-top: 1px solid var(--color-line);
  font-size: 1.08rem;
  line-height: 1.4;
  background-image: linear-gradient(var(--color-sapphire), var(--color-sapphire));
  background-size: 5px 5px;
  background-repeat: no-repeat;
  background-position: 0 1.2rem;
}
.z-join-ways li:last-child { border-bottom: 1px solid var(--color-line); }

.z-join-gold-quote {
  max-width: 22ch;
  margin: 1.8rem 0 2rem;
  padding: 0;
  border: 0;
  font-size: clamp(1.7rem, 3vw, 2.6rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.08;
  letter-spacing: -.035em;
}

html[data-theme="dark"] .z-join-ways li {
  background-image: linear-gradient(var(--color-link), var(--color-link));
}

@media (max-width: 63.99rem) {
  .z-join-community {
    grid-template-columns: 1fr;
    gap: 2.4rem;
  }
  .z-join-community .z-portrait {
    max-width: min(78vw, 22rem);
    justify-self: end;
  }
}
@media (min-width: 48rem) and (max-width: 63.99rem) {
  .z-join-community {
    grid-template-columns: minmax(0, 7fr) minmax(280px, 4fr);
  }
}
@media (max-width: 47.99rem) {
  .z-join #mitwirken {
    grid-template-columns: 1fr;
  }
  .z-join #mitwirken .z-portrait {
    max-width: min(85vw, 24rem);
    aspect-ratio: 4 / 3;
  }
  .z-join-photo img { width: min(100%, 85vw); }
  .z-join-dialog {
    width: min(78vw, 20rem);
    margin-right: var(--pad);
  }
}

/* —— Gestalten editorial refinement —— */
.z-make {
  --z-read: 48rem;
  --z-editorial: 70rem;
  --space-s: clamp(3.5rem, 6vw, 4.5rem);
  --space-m: clamp(6rem, 8vw, 7.5rem);
  --space-l: clamp(9.4rem, 11vw, 11.25rem);
}
.z-make .z-frame--tall img {
  aspect-ratio: 4 / 3;
  object-position: 50% 20%;
}
.z-make .z-section { padding-block: var(--space-m); }
.z-make .z-section--carbon { padding-block: var(--space-l); }
.z-make .z-section--gold { padding-block: clamp(5rem, 7vw, 6.4rem); }
.z-make .z-section > * { max-width: var(--z-read); }
.z-make .z-section--carbon > *,
.z-make .z-section--gold > * { max-width: 51.25rem; }
.z-make #navigator > * { margin-inline: 0; }
.z-make .z-section h2 { max-width: 16ch; }
.z-make .z-path li {
  min-height: 5rem;
  padding: 1.35rem 0 1.35rem 3.8rem;
  line-height: 1.55;
}
.z-make-h {
  max-width: 14ch;
  margin: 0 var(--pad) .8rem;
  font-size: clamp(2.2rem, 5vw, 4rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .92;
}
.z-make .z-lane-lead {
  max-width: 28ch;
  margin: 0 var(--pad) 1.4rem;
  font-size: clamp(1.4rem, 2.6vw, 1.95rem);
  line-height: 1.2;
}
.z-make-quote {
  max-width: 47.5rem;
  margin: var(--space-s) auto;
  padding: 0 var(--pad);
  border: 0;
  font-size: clamp(1.6rem, 2.8vw, 2.6rem);
  font-weight: 200;
  font-style: italic;
  line-height: 1.08;
}
.z-make-orient { grid-template-columns: 1fr; }
@media (min-width: 48rem) {
  .z-make-orient { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.z-make #reifegrad .z-orient {
  grid-template-columns: 1fr;
}
@media (min-width: 48rem) {
  .z-make #reifegrad .z-orient { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 72rem) {
  .z-make #reifegrad .z-orient {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .z-make #reifegrad .z-orient li {
    border-right: 1px solid var(--color-line);
    border-top: 0;
    padding: 1.6rem 1.4rem 0 0;
  }
  .z-make #reifegrad .z-orient li:nth-child(3n) { border-right: 0; padding-right: 0; }
}
.z-make #use-cases,
.z-make .z-split--flip {
  max-width: var(--z-editorial);
  margin-inline: auto;
  padding-block: var(--space-m);
}
.z-make #use-cases .z-split-copy h2,
.z-make .z-split--flip .z-split-copy h2 {
  margin: 0 0 .7rem;
  max-width: 12ch;
  font-size: clamp(2rem, 4.4vw, 3.4rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .94;
}
.z-make .z-portrait--wide {
  max-width: min(100%, 28rem);
  aspect-ratio: 4 / 3;
}
@media (max-width: 47.99rem) {
  .z-make #use-cases,
  .z-make .z-split--flip { grid-template-columns: 1fr; }
}

/* —— Anfragen editorial —— */
.z-ask-split {
  align-items: start;
  max-width: var(--z-editorial, 70rem);
  margin-inline: auto;
  padding-block: clamp(4rem, 8vw, 6rem);
  gap: clamp(40px, 5vw, 80px);
  grid-template-columns: minmax(0, 6fr) minmax(280px, 5fr);
}
.z-ask-split .z-split-copy h2 {
  margin: 0 0 .8rem;
  max-width: 12ch;
  font-size: clamp(2rem, 4.6vw, 3.6rem);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .94;
}
.z-ask-form {
  min-width: 0;
  padding-top: .2rem;
}
.z-ask-form h2 {
  max-width: 14ch;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
}
.z-ask .z-section { padding-block: clamp(4rem, 8vw, 6.5rem); }
.z-ask .z-section > * { max-width: 48rem; }
@media (max-width: 47.99rem) {
  .z-ask-split { grid-template-columns: 1fr; }
}