/**
 * CÍRCULO ORIGEM — Home
 * Schwelle: Foto + helle Schrift. .ground bleibt Papier.
 */

html:has(body.home) {
  scroll-behavior: auto;
  scroll-snap-type: none;
  overscroll-behavior-y: auto;
  scroll-padding-top: var(--header-h);
  scrollbar-gutter: stable;
}

/* Marke 24px → mit Padding ≈ 44px Trefferfläche, Header bleibt 56px */
.home .header .logo.mark {
  padding-block: 10px;
}

/* Logo links mit demselben Rand wie das Menü rechts (24px) */
@media (min-width: 769px) {
  .home .header-inner {
    position: relative;
  }

  .home .header .logo-wrapper {
    position: absolute;
    left: 24px;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    margin-left: 0;
    transform: none;
  }
}

/* Frei durchscrollen — kein Seiten-Einrasten (war proximity, wirkte hackend). */
@media (min-width: 769px) {
  /* Vormerken sitzt in Haltung — keine eigene Szene mehr */
  html:has(body.home) .scene.run-preorder {
    min-height: 0;
  }
}


.page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--bg);
  position: relative;
  width: 100%;
  max-width: var(--screen-max);
  margin-inline: auto;
}

/* Sehr breite Schirme: die Seite läuft durch. Der Grund dahinter ist derselbe,
   damit auch beim Überziehen am Rand keine zweite Fläche auftaucht. */
html:has(body.home),
body.home {
  background: var(--screen-rim);
}

.threshold {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  /* Ein Screen ohne Ueberhang — svh (kein dvh: URL-Leiste macht sonst Ruckler) */
  height: 100vh;
  height: 100svh;
  min-height: 100vh;
  min-height: 100svh;
  max-height: 100vh;
  max-height: 100svh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: calc(var(--header-h) + env(safe-area-inset-top, 0px)) 20px env(safe-area-inset-bottom, 0px);
  overflow: hidden;
  color: #f5f5f7;
  isolation: isolate;
}

@supports not (height: 100svh) {
  .threshold {
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;
  }
}

.threshold-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #111;
}

.threshold-photo {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  transition: opacity var(--blend, 2.8s) ease-in-out;
}

.threshold-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Default ≈ Wire-Fokus Landschaft — CMS überschreibt früh, kein Nachsprung */
  object-position: 53.3% 38.1%;
}

/* Tor (4415) sitzt im Foto links der Mitte — etwas nach rechts unter das Logo */
.threshold-photo img[src*="4415"] {
  transform: translate3d(4.5%, 0, 0) scale(1.1);
  transform-origin: center center;
}

.threshold-photo.is-active {
  opacity: 1;
  z-index: 1;
}

.threshold-media::after {
  content: none;
  display: none;
}

.threshold > *:not(.threshold-media) {
  position: relative;
  z-index: 1;
}

.landing-logo {
  text-decoration: none;
  color: #f5f5f7;
  transition: opacity 0.35s var(--ease);
}

.home.is-brand-stuck .threshold .landing-logo {
  opacity: 0;
  pointer-events: none;
}

.landing-line {
  display: block;
}

.intro-line,
.coming-soon {
  margin-top: var(--space-md);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-nav);
  letter-spacing: 0.01em;
  color: #f5f5f7;
}

.coming-soon {
  margin-top: 0;
  font-size: var(--fs-nav);
  font-weight: 400;
  letter-spacing: var(--track-kicker);
  text-transform: uppercase;
  color: #f5f5f7;
}

.ground {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  text-align: left;
  background: var(--bg);
}

.ground-story {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(2rem, 3.5vw, 4rem);
  row-gap: clamp(0.85rem, 1.5vh, 1.25rem);
  align-items: start;
  width: 100%;
}

.ground-story > .edition-kicker {
  grid-column: 1 / 5;
  grid-row: 1;
  margin: 0;
}

.ground-title {
  grid-column: 1 / 5;
  grid-row: 2;
  position: sticky;
  top: calc(var(--header-h) + 1.75rem);
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fs-display);
  line-height: 1.14;
  letter-spacing: 0.04em;
  word-spacing: 0.04em;
  margin: 0;
  margin-left: -3px;
  max-width: 12ch;
}

.ground-story-body {
  grid-column: 5 / 13;
  grid-row: 2;
  min-width: 0;
  max-width: 40rem;
  padding-top: 0.2rem;
}

/* Olivenzweig — freigestellt, rechts gegenüber dem Kreis, mit Luft darum */
.ground-story > .zweig {
  grid-column: 6 / 13;
  grid-row: 3;
  justify-self: end;
  width: min(30rem, 100%);
  margin: clamp(0.5rem, 2.5vh, 2rem) 0 0;
}

.ground-story > .zweig img {
  display: block;
  width: 100%;
  height: auto;
}

/* Hell: Foto · Dunkel: Haarlinien-Skizze */
.ground-story > .zweig .zweig-skizze {
  display: none;
}

:root[data-theme="dark"] .ground-story > .zweig .zweig-foto {
  display: none;
}

:root[data-theme="dark"] .ground-story > .zweig .zweig-skizze {
  display: block;
}

:root[data-theme="dark"] .ground-story > .zweig .zweig-skizze img {
  filter: invert(1);
}

.ground-circle {
  grid-column: 1 / 5;
  grid-row: 3;
  width: 140px;
  height: 140px;
  margin-top: clamp(1.25rem, 2.5vh, 2rem);
  margin-bottom: 0;
  flex-shrink: 0;
  border: 1px solid var(--text-muted);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-xs);
  letter-spacing: var(--track-kicker);
  line-height: 1.45;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ground-lead {
  max-width: none;
  font-family: var(--font-sans);
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  font-weight: 400;
  line-height: 1.58;
  letter-spacing: 0;
}

.ground-lead + .ground-lead {
  margin-top: 1.6rem;
}

.brand-name {
  font: inherit;
  letter-spacing: inherit;
  text-transform: none;
}

.ground .path-row {
  justify-content: flex-start;
  margin-top: 2.2rem;
}

.ground-meta {
  margin-top: 1.75rem;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-kicker);
  letter-spacing: var(--track-meta);
  line-height: 1.85;
  text-transform: uppercase;
  color: var(--text-muted);
  max-width: 28rem;
}

.ground-meta br {
  display: block;
  content: "";
  margin-top: 0.35em;
}

.ground-preorder {
  margin-top: clamp(2.5rem, 5vh, 4rem);
  flex-shrink: 0;
}

.ground-preorder h3 {
  font-family: var(--font-sans);
  font-size: clamp(1.125rem, 1rem + 0.3vw, 1.25rem);
  font-weight: 500;
}

.ground-preorder > p {
  font-family: var(--font-sans);
  font-size: clamp(1.0625rem, 0.95rem + 0.3vw, 1.1875rem);
  line-height: 1.55;
  max-width: 32rem;
}

.ground-preorder .edition-kicker {
  margin-top: 0;
}

.footer {
  margin-top: 0;
}

@media (max-width: 768px) {
  html:has(body.home) {
    overscroll-behavior-y: auto;
    overflow-x: clip;
  }

  body.home {
    overflow-x: clip;
  }

  .path-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 22rem;
    margin-inline: 0;
  }

  /* Schwelle: dichter Stack, genau ein Screen (svh — kein dvh-Ruckler) */
  .threshold {
    height: 100vh;
    height: 100svh;
    min-height: 100vh;
    min-height: 100svh;
    max-height: 100vh;
    max-height: 100svh;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    padding: calc(var(--header-h) + env(safe-area-inset-top, 0px) + 8px) 20px
      max(20px, env(safe-area-inset-bottom, 0px));
  }

  .threshold-photo img {
    object-position: center 42%;
  }

  .lockup {
    --lk: 14px;
  }

  .lockup .landing-logo.wordmark {
    margin-top: 0;
  }

  .lockup .landing-logo.wordmark.wordmark-stempel {
    width: clamp(12.6rem, 64.8vw, 19.8rem);
  }

  .lockup .intro-line {
    margin-top: 10px;
    font-size: calc((clamp(3.18rem, 13.8vw, 4.02rem) * 0.25 - 7px) * 0.9);
  }

  .lockup-mark {
    display: none;
  }

  .season-line {
    min-width: 0;
    width: min(100%, 20rem);
    margin-top: 18px;
    margin-bottom: 0;
    padding-top: 0;
  }

  .coming-soon {
    font-size: var(--fs-kicker);
    letter-spacing: 0.12em;
  }

  .coming-sub {
    margin-top: 6px;
    font-size: var(--fs-body);
    line-height: 1.45;
    max-width: 17rem;
  }

  .threshold-link {
    width: auto;
    min-width: 11.5rem;
    min-height: 44px;
    margin-top: 14px;
    padding: 0.65rem 1.6rem;
    justify-content: center;
  }

  .ground {
    padding: 2.5rem var(--gutter) 2.75rem;
  }

  .ground-story {
    grid-template-columns: 1fr;
  }

  .ground-story > .edition-kicker,
  .ground-title,
  .ground-story-body,
  .ground-circle {
    grid-column: 1 / -1;
    grid-row: auto;
    position: static;
    max-width: none;
  }

  .ground .edition-kicker {
    font-size: var(--fs-kicker);
    letter-spacing: 0.1em;
    max-width: none;
  }

  .ground-title {
    max-width: none;
    font-size: var(--fs-display);
    margin-bottom: 1.15rem;
  }

  .ground-title .title-br {
    display: block;
    font-size: 0;
    line-height: 0;
  }

  .ground-lead {
    font-size: clamp(1.0625rem, 3.4vw, 1.125rem);
  }

  .ground-lead + .ground-lead {
    margin-top: 1rem;
  }

  .ground-lead .brand-name {
    display: inline;
    margin-bottom: 0;
  }

  .ground .path-row {
    max-width: none;
    margin-top: 1.35rem;
  }

  .ground-meta {
    margin-top: 1rem;
    font-size: var(--fs-kicker);
    letter-spacing: 0.08em;
    max-width: 16.5rem;
  }

  .ground-circle {
    width: 112px;
    height: 112px;
    margin-top: 1.75rem;
    font-size: var(--fs-xs);
  }
}

@media (prefers-reduced-motion: reduce) {
  html:has(body.home) {
    scroll-snap-type: none;
  }

  .threshold-photo {
    transform: none;
    transition: none;
  }
}


/* Lockup: Wortmarke + Satzzeile, Saisonzeile in der Gruppe */
.lockup {
  --lk: clamp(22px, 3vw, 35px);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lockup .landing-logo.wordmark {
  color: #f5f5f7;
  margin-top: 5px;
}

.lockup .landing-logo.wordmark.wordmark-stempel {
  margin-top: 0;
  color: inherit;
  -webkit-text-stroke: 0;
}

.threshold .landing-logo.wordmark,
.threshold .intro-line {
  transition: color var(--blend, 2.8s) ease-in-out, opacity 0.35s var(--ease);
}

.threshold .landing-logo.wordmark:not(.wordmark-stempel) {
  -webkit-text-stroke: 0.65px currentColor;
  text-shadow: none;
}

/* Satzzeile unter Stempel-Kreis */
.lockup .intro-line {
  margin-top: calc(var(--lk) * 0.85);
  font-family: "Söhne", system-ui, sans-serif;
  font-weight: 400;
  font-size: calc((clamp(4.875rem, 12.6vw, 6.75rem) * 0.25 - 7px) * 0.9);
  letter-spacing: var(--track-kicker);
  text-transform: uppercase;
  color: #f5f5f7;
}

.threshold .intro-line {
  -webkit-text-stroke: 0.4px currentColor;
}

.lockup-mark {
  display: none;
}

.home .header {
  transition: opacity var(--blend, 2.8s) ease-in-out;
}

.season-line {
  display: flex;
  transition: opacity var(--blend, 2.8s) ease-in-out;
  flex-direction: column;
  align-items: center;
  margin-top: 28px;
  padding-top: 0;
  border-top: none;
  min-width: min(400px, 86vw);
}

.coming-sub {
  margin-top: var(--space-xs);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
  color: #f5f5f7;
}

.threshold-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  margin-top: 0;
  padding: 0.85rem 2.25rem;
  border: 1px solid #f5f5f7;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-nav);
  letter-spacing: var(--track-kicker);
  text-transform: uppercase;
  color: #f5f5f7;
  text-decoration: none;
  transition: background 0.3s var(--ease), color 0.3s var(--ease);
}

.threshold-link:hover,
.threshold-link:focus-visible {
  background: #f5f5f7;
  color: #111;
}

/* Szenen: vollbreit wie Header — Text nur über --frame-pad (nicht page-width zentriert) */
.home main > .run,
.home main > .scene.ground {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.home .scene:not(.threshold):not(.scene-still):not(.scene-contact) {
  box-sizing: border-box;
  position: relative;
  z-index: 2;
  background: var(--bg);
  /* Inhalt bestimmt Höhe — kein 100vh-Leerraum mehr */
  min-height: 0;
  padding-top: calc(var(--header-h) + var(--scene-pad-y));
  padding-bottom: var(--scene-pad-y);
  padding-inline: var(--frame-pad);
  scroll-margin-top: var(--header-h);
}

/* Haltung: gleiche Luft wie die anderen weissen Szenen */
.home .scene.ground.scene-snap {
  box-sizing: border-box;
  min-height: 0;
  height: auto;
  max-height: none;
  overflow: visible;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding-top: calc(var(--header-h) + var(--scene-pad-y));
  padding-bottom: var(--scene-pad-y);
  padding-inline: var(--frame-pad);
}

/*
 * Weisse Seiten: Text im Rahmen.
 * Bilder (grosse run-figure ausser Trio) springen über den Rahmen.
 * Header + Footer sind bereits vollbreit; Inhalt darin auf --frame-pad.
 */
.home .scene:not(.threshold):not(.scene-still):not(.run-trio) > .run-figure,
.home .scene:not(.threshold):not(.scene-still):not(.run-trio) > figure.run-figure {
  width: calc(100% + 2 * var(--frame-pad));
  max-width: none;
  margin-inline: calc(-1 * var(--frame-pad));
  box-sizing: border-box;
}

/* φ-Story: Modulhöhe × φ-Länge — linke Flucht = Text (kein Bleed nach aussen) */
.home .scene:not(.threshold):not(.scene-still) > .run-figure.ratio-phi,
.home .scene:not(.threshold):not(.scene-still) > figure.run-figure.ratio-phi {
  width: calc(var(--mod-square) * var(--phi));
  max-width: 100%;
  margin-inline: 0;
  margin-left: 0;
  justify-self: start;
}

.run-origem .origem-fig.ratio-phi,
.run-origem .fig-left.ratio-phi {
  max-width: min(100%, calc(var(--mod-square) * var(--phi) * 1.15));
  margin-left: 0;
}

/* Caption bündig unter dem Foto: links→rechts, rechts→links */
.home .scene:not(.threshold):not(.scene-still):not(.run-trio) > .run-figure.fig-left > figcaption {
  display: block;
  width: 100%;
  margin: var(--space-xs) 0 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  text-align: right;
}

.home .scene:not(.threshold):not(.scene-still):not(.run-trio) > .run-figure.fig-right > figcaption {
  display: block;
  width: 100%;
  margin: var(--space-xs) 0 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  text-align: left;
}

/* Herkunft: Inhalt bestimmt Hoehe, darf laenger als ein Screen sein */
.home .scene.run-sheet {
  min-height: 0;
}

.section-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(20px, 2.5vw, 40px);
  align-items: start;
}

.home main > .run.scene.section-grid {
  display: grid;
  align-content: start;
}

.scene-text,
.section-grid .run-copy {
  grid-column: 1 / 7;
  grid-row: 1;
}

.fig-left { grid-column: 1 / 9; grid-row: 2; }
.fig-right { grid-column: 7 / 13; grid-row: 2; }
.fig-full { grid-column: 1 / 13; grid-row: 2; }

/* Origem: Titel, sofort Bilder, Text darunter */
.home .scene.run-origem {
  display: flex;
  flex-direction: column;
  gap: clamp(1.75rem, 3.5vh, 2.75rem);
  padding-top: calc(var(--header-h) + var(--scene-pad-y));
  padding-bottom: clamp(2rem, 4vh, 3.25rem);
}

.run-origem .origem-head {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(2rem, 3.5vw, 4rem);
  row-gap: clamp(0.85rem, 1.5vh, 1.25rem);
  align-items: start;
  width: 100%;
}

.run-origem .origem-head > .edition-kicker {
  grid-column: 1 / 5;
  grid-row: 1;
  margin: 0;
}

.run-origem .origem-head > h2 {
  grid-column: 1 / 5;
  grid-row: 2;
  max-width: 12ch;
  margin: 0;
}

.run-origem .origem-media {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(24px, 2.8vw, 48px);
  row-gap: clamp(24px, 2.8vw, 48px);
  align-items: stretch;
  width: 100%;
}

.run-origem .origem-fig-main {
  grid-column: 1 / 9;
  margin: 0;
  width: 100%;
  max-width: none;
  background: var(--bg-cream, #f5f5f7);
  overflow: hidden;
  position: relative;
}

.run-origem .origem-fig-side {
  grid-column: 9 / 13;
  margin: 0;
  width: 100%;
  max-width: none;
  background: var(--bg-cream, #f5f5f7);
  overflow: hidden;
  position: relative;
}

.run-origem .origem-fig-main picture,
.run-origem .origem-fig-side picture {
  display: block;
  width: 100%;
  height: 100%;
}

.run-origem .origem-fig-main img,
.run-origem .origem-fig-side img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: clamp(16rem, 42vw, 34rem);
  object-fit: cover;
  object-position: center;
}

.run-origem .origem-fig-main figcaption,
.run-origem .origem-fig-side figcaption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.run-origem .origem-copy {
  max-width: 40rem;
  margin-top: clamp(0.25rem, 1vh, 0.75rem);
  padding-top: 0;
}

.run-origem .origem-copy p {
  font-family: var(--font-sans);
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  line-height: 1.58;
  max-width: none;
}

.run-origem .origem-copy p + p {
  margin-top: 1.35em;
}

.run-origem .origem-fig,
.run-origem .fig-left {
  grid-column: unset;
  margin-top: 0;
}

.run-origem .fig-left.ratio-phi {
  max-width: none;
  margin-left: 0;
}

/* Edition: Titel | Text, dann Bildpaar, Produkte darunter */
.run-edition {
  display: flex;
  flex-direction: column;
  gap: clamp(4.5rem, 9vh, 7.5rem);
  padding-top: clamp(2rem, 4vh, 3.25rem);
}

.run-edition .edition-intro {
  display: flex;
  flex-direction: column;
  gap: clamp(2.5rem, 5vh, 4rem);
  width: 100%;
}

.run-edition .edition-story {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(2rem, 3.5vw, 4rem);
  row-gap: clamp(0.85rem, 1.5vh, 1.25rem);
  align-items: start;
  width: 100%;
}

.run-edition .edition-story > .edition-kicker {
  grid-column: 1 / 5;
  grid-row: 1;
  margin: 0;
}

.run-edition .edition-story > h2 {
  grid-column: 1 / 5;
  grid-row: 2;
  position: sticky;
  top: calc(var(--header-h) + 1.75rem);
  max-width: 12ch;
  margin: 0;
}

.run-edition .edition-story .run-copy {
  grid-column: 5 / 13;
  grid-row: 2;
  position: relative;
  z-index: 2;
  min-width: 0;
  padding-right: 0;
  padding-top: 0.2rem;
  max-width: none;
  box-sizing: border-box;
}

.run-edition .edition-story .run-copy .lead,
.run-edition .edition-story .run-copy p {
  max-width: 38rem;
  font-family: var(--font-sans);
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  line-height: 1.58;
}

.run-edition .edition-story .run-copy p + p {
  margin-top: 1.35em;
}

.run-edition .edition-media {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(24px, 2.8vw, 48px);
  row-gap: clamp(24px, 2.8vw, 48px);
  align-items: stretch;
  width: 100%;
}

.run-edition .edition-fig-main {
  grid-column: 1 / 9;
  margin: 0;
  width: 100%;
  max-width: none;
  align-self: stretch;
  background: var(--bg-cream, #f5f5f7);
  overflow: hidden;
}

.run-edition .edition-fig-side {
  grid-column: 9 / 13;
  margin: 0;
  width: 100%;
  max-width: none;
  align-self: stretch;
  background: var(--bg-cream, #f5f5f7);
  overflow: hidden;
}

.run-edition .edition-media-alt .edition-fig-side {
  grid-column: 1 / 5;
}

.run-edition .edition-media-alt .edition-fig-main {
  grid-column: 5 / 13;
}

.run-edition .edition-fig-main picture,
.run-edition .edition-fig-side picture {
  display: block;
  width: 100%;
  height: 100%;
}

.run-edition .edition-fig-main img,
.run-edition .edition-fig-side img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: clamp(16rem, 42vw, 34rem);
  object-fit: cover;
  object-position: center;
}

.run-edition .edition-fig-main figcaption,
.run-edition .edition-fig-side figcaption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.run-edition .edition-fig-main,
.run-edition .edition-fig-side {
  position: relative;
}

.run-edition .path-row {
  margin-top: var(--space-lg);
}
.run-edition .run-trio-grid {
  margin-top: 0;
}

.run-copy,
.run-intro {
  max-width: var(--measure);
}

.run h2 {
  max-width: 16ch;
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fs-title);
  line-height: 1.14;
  letter-spacing: 0.04em;
  word-spacing: 0.04em;
  margin-left: -3px; /* Serifen-Optik: nach aussen */
}

.run h3 {
  font-size: var(--fs-h3);
  font-weight: 400;
  line-height: var(--lh-lead);
}

.run-copy p + p,
.run-intro p + p,
.run-preorder p + .path-row {
  margin-top: var(--space-stack);
}

.run .lead {
  font-size: var(--fs-lead);
  line-height: var(--lh-lead);
  font-weight: 400;
}

.run-copy p,
.run-intro p,
.run-preorder p,
.run-pair p {
  line-height: var(--lh-body);
}

.run-figure,
.scene figure {
  margin: 0;
}

.run-figure picture {
  display: block;
  width: 100%;
}

.run-figure img,
.scene figure img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  object-position: center 55%;
}

/* Nur Szenen-Figuren begrenzen — nicht Schwelle / Still-Karussell */
.home .scene .run-figure img {
  max-height: 62svh;
  width: 100%;
  object-fit: cover;
}

/* Modul-Quadrat (Hand, Produkte) und φ-Länge (Story, Höhe = Modul) */
.ratio-square img {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: cover;
}

.ratio-phi {
  width: calc(var(--mod-square) * var(--phi));
  max-width: 100%;
  justify-self: start;
}

.ratio-phi > picture {
  display: block;
  width: 100%;
  height: var(--mod-square);
}

.home .scene .run-figure.ratio-phi img,
.ratio-phi img {
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: cover;
}

/* Edition-Hain: Hochformat belassen */
.ratio-34 img { aspect-ratio: 3 / 4; }
.ratio-43 img { aspect-ratio: 4 / 3; } /* Legacy, nicht für Story nutzen */

.run-origem .run-figure img {
  object-position: center 42%;
}

.run-origem .ratio-phi img {
  object-position: center 42%;
}

.run-figure figcaption {
  margin-top: var(--space-xs);
  font-size: var(--fs-xs);
  letter-spacing: 0.02em;
  color: var(--text-muted);
}

/* Bild von links → Caption rechts; Bild von rechts → Caption links */
.run-figure.fig-left > figcaption,
.home .run-origem .fig-left > figcaption {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  text-align: right;
}

.run-figure.fig-right > figcaption,
.home .run-edition .fig-right > figcaption {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}

.run-intro {
  margin-bottom: clamp(var(--space-lg), 6vh, var(--space-xl));
}

.run-sheet-title {
  margin-bottom: clamp(2.25rem, 5vh, 3.5rem);
}

/* Herkunft: Foto + Tabellen dieselbe Flucht-Breite (Quadrat × φ) */
.run-sheet {
  --herkunft-col: min(42rem, 100%);
  --herkunft-block: min(var(--herkunft-col), calc(var(--mod-square) * var(--phi)));
}

/* Abstand Titel → Abbildung: Titel-Margin auf 1.25rem, wenn Herkunft-Figure folgt */
.run-sheet-title:has(+ .herkunft-figure) {
  margin-bottom: 1.25rem;
}

.herkunft-figure {
  margin: 0 0 1.75rem;
  width: var(--herkunft-block);
  max-width: 100%;
}

.herkunft-figure picture {
  display: block;
  width: 100%;
  height: var(--mod-square);
}

.scene .herkunft-figure img,
.herkunft-figure img,
.herkunft-figure.ratio-phi img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center 55%;
}

/* Zeichnung: nichts abschneiden; Foto bleibt unter der Skizze sichtbar */
.herkunft-figure.is-zeichnung img,
.run-figure.is-zeichnung > .swap-alt {
  object-fit: contain;
  object-position: center;
  background: transparent;
}

/* Produkt-Hover: schwarze Linien multiplizieren über dem Foto */
.run-trio-grid .run-figure.is-zeichnung.has-swap > .swap-alt {
  mix-blend-mode: multiply;
}

@media (hover: hover) and (pointer: fine) {
  .run-trio-grid .run-figure.is-zeichnung.has-swap:hover > .swap-alt,
  .run-trio-grid .run-figure.is-zeichnung.has-swap:focus-within > .swap-alt {
    opacity: 0.92;
  }
}

.run-trio-grid .run-figure.is-zeichnung.has-swap.is-swapped > .swap-alt {
  opacity: 0.92;
}

:root[data-theme="dark"] .herkunft-figure.is-zeichnung img,
:root[data-theme="dark"] .run-figure.is-zeichnung > .swap-alt {
  filter: invert(1);
}

:root[data-theme="dark"] .run-trio-grid .run-figure.is-zeichnung.has-swap > .swap-alt {
  mix-blend-mode: screen;
}

.herkunft-figure figcaption {
  margin-top: 0.4rem;
  font-size: var(--fs-xs, 0.85rem);
  letter-spacing: 0.02em;
  color: var(--text-muted, inherit);
}

/* Produkt-Rhythmus vor der Tabelle: Kicker / Titel / Zeile */
.origin-lead {
  width: 100%;
  max-width: var(--herkunft-block);
  margin: 0 0 clamp(1.75rem, 3.5vh, 2.5rem);
}

.origin-lead .edition-kicker {
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-family: var(--font-sans);
  font-weight: 400;
}

.origin-lead h3 {
  margin: 0.35rem 0 0;
  font-family: var(--font-sans);
  font-size: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.01em;
  color: var(--text);
  max-width: none;
}

.origin-lead > p:not(.edition-kicker) {
  margin: 0.25rem 0 0;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.45;
  color: var(--text-muted);
  max-width: none;
}

.origin-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2.5rem, 5vh, 3.75rem);
  align-items: start;
  width: 100%;
  max-width: var(--herkunft-block);
}

.origin-group {
  min-width: 0;
}

.run-sheet .origin-group-kicker {
  margin-top: 0;
  margin-bottom: 0.65rem;
}

/* Fluchten: Titel, Foto, Lead, Tabelle — gleiche linke Kante */
.run-sheet-title,
.herkunft-figure,
.origin-lead,
.origin-groups {
  margin-left: 0;
}

.run-table {
  margin-top: 0;
  width: 100%;
  max-width: none;
}

@media (max-width: 900px) {
  .origin-group + .origin-group .origin-group-kicker {
    margin-top: 0;
  }
}

.run-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--space-lg), 6vw, var(--space-xl));
  margin-top: 0;
}

.run-pair article,
.run-pair-quiet p {
  max-width: 32rem;
}

.run-trio > h2 {
  margin-bottom: clamp(1.5rem, 3vh, 2.25rem);
  max-width: none;
}

/* Produktgitter */
.run-trio-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(2rem, 3.5vw, 3.5rem);
  align-items: start;
  width: 100%;
  max-width: var(--desktop-w);
  margin-inline: auto;
  padding-inline: 0;
  box-sizing: border-box;
}

.run-trio-grid .trio-col {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.run-trio-grid .run-figure {
  width: 100%;
  max-width: none;
  margin: 0;
  background: var(--bg-cream, #f5f5f7);
  overflow: hidden;
}

.run-trio-grid .run-figure picture {
  display: block;
  width: 100%;
}

.run-trio-grid .ratio-square img,
.run-trio-grid .ratio-34 img {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
  display: block;
  max-height: none;
}

.run-trio-grid .run-figure figcaption {
  display: none; /* Meta liegt unter dem Bild wie bei Shop-Karten */
}

.run-trio-grid .trio-col .edition-kicker {
  margin-top: 0.85rem;
  margin-bottom: 0;
  font-size: 11px;
  line-height: 1.35;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-family: var(--font-sans);
  font-weight: 400;
}

.run-trio-grid .trio-col h3 {
  margin-top: 0.35rem;
  margin-bottom: 0;
  font-family: var(--font-sans);
  font-size: clamp(1.125rem, 1rem + 0.42vw, 1.5rem);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.01em;
  color: var(--text);
}

.run-trio-grid .trio-col p {
  margin-top: 0.25rem;
  max-width: none;
  font-family: var(--font-sans);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0;
  color: var(--text-muted);
}

.run-trio-grid .trio-col p + p {
  margin-top: 0.15rem;
}

.run-trio-grid .trio-price {
  margin-top: 0.55rem !important;
  font-size: 0.875rem !important;
  line-height: 1.35 !important;
  color: var(--text) !important;
  font-weight: 500;
}

.run-trio-grid .trio-cta {
  display: inline-block;
  margin-top: 0.65rem;
  font-family: var(--font-sans);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--text);
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
  align-self: flex-start;
}

.run-trio-grid .trio-cta:hover {
  opacity: 0.7;
}

.run-trio-grid .trio-col-later {
  opacity: 0.72;
}

.run-trio-grid .trio-placeholder {
  aspect-ratio: 1 / 1;
  width: 100%;
  background: var(--bg-cream, #f5f5f7);
}

.run-trio-grid .trio-placeholder[hidden] {
  display: none;
}

.run-trio-grid figure > picture[hidden] {
  display: none;
}

@media (max-width: 900px) {
  .run-trio-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem 2rem;
    padding-inline: 0;
  }

  .run-trio-grid .trio-col h3 {
    font-size: 26px;
    line-height: 28px;
  }

  .run-edition .edition-story {
    grid-template-columns: 1fr;
  }

  .run-edition .edition-story > .edition-kicker,
  .run-edition .edition-story > h2,
  .run-edition .edition-story .run-copy {
    grid-column: 1 / -1;
    grid-row: auto;
    position: static;
  }

  .run-edition .edition-story > h2 {
    max-width: 16ch;
  }

  .run-origem .origem-head,
  .run-origem .origem-media {
    grid-template-columns: 1fr;
  }

  .run-origem .origem-head > .edition-kicker,
  .run-origem .origem-head > h2,
  .run-origem .origem-copy,
  .run-origem .origem-fig-main,
  .run-origem .origem-fig-side {
    grid-column: 1 / -1;
    grid-row: auto;
    position: static;
    max-width: none;
  }

  .run-origem .origem-fig-main img,
  .run-origem .origem-fig-side img {
    min-height: clamp(14rem, 62vw, 22rem);
  }

  .run-edition .edition-media {
    grid-template-columns: 1fr 1fr;
  }

  .run-edition .edition-fig-main,
  .run-edition .edition-fig-side,
  .run-edition .edition-media-alt .edition-fig-main,
  .run-edition .edition-media-alt .edition-fig-side {
    grid-column: auto;
  }

  .run-edition .edition-fig-main img,
  .run-edition .edition-fig-side img {
    min-height: clamp(12rem, 48vw, 22rem);
  }
}

@media (max-width: 768px) {
  .run-trio-grid {
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 2.5rem;
    padding-inline: 0;
  }

  @supports (grid-template-rows: subgrid) {
    .run-trio-grid .trio-col {
      display: flex;
      flex-direction: column;
      grid-row: auto;
      grid-template-rows: none;
    }

    .run-trio-grid .trio-col:nth-child(n + 3) > .run-figure,
    .run-trio-grid .trio-col:nth-child(n + 4) > .run-figure {
      margin-top: 0;
    }
  }

  .run-trio-grid .trio-col > p:not(.edition-kicker):not(.trio-price),
  .run-trio-grid .trio-col:not(:nth-child(2n)) > p:not(.edition-kicker):not(.trio-price),
  .run-trio-grid .trio-col:not(:nth-child(3n)) > p:not(.edition-kicker):not(.trio-price),
  .run-trio-grid .trio-col:nth-child(3n) > p:not(.edition-kicker):not(.trio-price) {
    width: 100%;
  }

  .run-trio-grid .trio-col .edition-kicker {
    margin-top: 0.85rem;
  }

  .run-trio-grid .trio-col h3 {
    margin-top: 0.35rem;
    font-size: 1.3125rem;
    line-height: 1.35;
    max-width: none;
  }

  .run-trio-grid .trio-col p {
    margin-top: 0.25rem;
  }

  .run-trio-grid .ratio-square img,
  .run-trio-grid .ratio-34 img {
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: none;
  }
}

.run-preorder {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
  max-width: var(--measure);
}

/* Pferd: eigene Vollseite, nur Standbild */
.home main > .scene-still,
.home .scene.scene-still {
  position: relative;
  z-index: 1;
  max-width: none;
  width: 100%;
  margin: 0;
  padding: calc(var(--header-h) + env(safe-area-inset-top, 0px)) 20px env(safe-area-inset-bottom, 0px);
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  height: 100vh;
  height: 100svh;
  height: 100dvh;
  overflow: hidden;
  background: #111;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #f5f5f7;
}

.scene-still .threshold-media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.scene-still .threshold-photo {
  transition-duration: 1.1s;
}

.scene-still .threshold-photo img {
  object-fit: cover;
  object-position: center center;
}

/* Lockup auf Still: wie Frontpage — weiss auf dem Bild */
.scene-still > *:not(.threshold-media) {
  position: relative;
  z-index: 1;
}

.scene-still .still-lockup .landing-logo.wordmark:not(.wordmark-stempel) {
  color: #f5f5f7;
  -webkit-text-stroke: 0.65px #f5f5f7;
}

.scene-still .still-lockup .intro-line {
  color: #f5f5f7;
  -webkit-text-stroke: 0.4px #f5f5f7;
}

.scene-still .still-lockup .lockup-mark {
  display: none;
}

/* Abspann: weisse Vollseite, nur Kontakt + Footer (Lockup sitzt auf Still) */
.home main > .scene-contact,
.home .scene.scene-contact {
  position: relative;
  max-width: none;
  width: 100%;
  margin: 0;
  margin-inline: 0;
  padding: 0;
  padding-inline: 0;
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  height: auto;
  overflow: visible;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  text-align: left;
  background: var(--bg, #fff);
  color: var(--text, #1d1d1f);
}

.scene-contact .contact-body,
.scene-contact .run-kontakt {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-top: calc(var(--header-h) + env(safe-area-inset-top, 0px) + var(--scene-pad-y));
  padding-inline: var(--frame-pad);
  padding-bottom: var(--scene-pad-y);
  min-height: 0;
  text-shadow: none;
}

/* Kein Endlos-Durchlauf mehr — Seite endet am Footer */
.story-cycle {
  display: contents;
}

.story-cycle--clone {
  display: none !important;
}

.scene-contact h2 {
  margin-left: -3px;
  color: var(--text, #1d1d1f);
}

.scene-contact .edition-kicker {
  color: var(--text-muted, #6e6e73);
}

.scene-contact .run-credits {
  color: var(--text, #1d1d1f);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.scene-contact .run-credits a {
  color: var(--text, #1d1d1f);
  text-decoration: underline;
  text-underline-offset: 4px;
  background: none;
  padding-block: 12px;
  padding-inline: 0;
  min-height: 0;
  display: inline;
  text-shadow: none;
}

.scene-contact .run-credits .contact-aside {
  margin-top: 0.35rem;
  color: var(--text-muted, #6e6e73);
  text-shadow: none;
}

/* Kontakt: Lockup unter dem Schriftzug, Adresse darunter */
.scene-contact .contact-figure {
  margin: clamp(1.5rem, 3vh, 2.5rem) 0 clamp(1.75rem, 3.5vh, 2.75rem);
  width: min(30rem, 100%);
  max-width: 100%;
  overflow: hidden;
}

.scene-contact .contact-media {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
}

.scene-contact .contact-media > picture {
  display: block;
  width: 100%;
}

.scene-contact .contact-media > picture img {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

.scene-contact .contact-figure figcaption {
  margin-top: 0.7rem;
  padding-inline: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-xs);
  letter-spacing: 0.02em;
  color: var(--text-muted, #6e6e73);
  text-shadow: none;
}

/* Zeichnung wächst aus dem fotografierten Stamm — nur innerhalb des Lockups */
.scene-contact .baum {
  position: absolute;
  left: 16%;
  top: 2%;
  width: 80%;
  margin: 0;
  z-index: 2;
  pointer-events: none;
  mix-blend-mode: multiply;
}

.scene-contact .baum img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
}

.scene-contact .baum .baum-linie {
  display: none;
}

:root[data-theme="dark"] .scene-contact .baum .baum-voll {
  display: none;
}

:root[data-theme="dark"] .scene-contact .baum .baum-linie {
  display: block;
}

/* Footer: grosser Papierbereich am Ende */
.scene-contact .site-footer,
.scene-contact .footer {
  position: relative;
  z-index: 3;
  flex: 0 0 auto;
  width: 100%;
  margin-top: 0;
  background: var(--bg, #fff);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: var(--text-muted);
  padding-top: clamp(2.75rem, 7vh, 4.5rem);
  padding-bottom: calc(clamp(2rem, 5vh, 3.25rem) + env(safe-area-inset-bottom, 0px));
  border-top: none;
  text-shadow: none;
}

.scene-contact .footer-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  gap: 1.25rem 1.5rem;
  padding-inline: var(--frame-pad);
}

.scene-contact .footer-places {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.35rem;
  font-size: 13px;
  letter-spacing: 0.02em;
  line-height: 1.35;
  color: var(--text-muted);
  text-shadow: none;
}

.scene-contact .footer-links {
  justify-self: end;
  gap: 1.5rem;
}

.scene-contact .footer-links a {
  display: inline;
  min-height: 0;
  padding-block: 12px;
  padding-inline: 0;
  background: none;
  color: var(--text-muted);
  font-size: 15px;
  letter-spacing: 0.02em;
  text-shadow: none;
}

.scene-contact .footer-links a:hover,
.scene-contact .footer-links a:focus-visible {
  color: var(--text);
  opacity: 1;
}

@media (max-width: 768px) {
  .home .scene.scene-still {
    height: 100svh;
    height: 100dvh;
    min-height: 100svh;
  }

  .scene-contact .footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .scene-contact .footer-places {
    align-items: center;
    order: 2;
  }

  .scene-contact .footer-links {
    order: 3;
    justify-self: center;
  }

}

.run-kontakt .lead a {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.run-credits {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  max-width: 22rem;
  margin-top: var(--space-md);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: 400;
}

.run-credits p {
  margin: 0;
}

.run-credits a {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

@media (max-width: 768px) {
  /* Mobile-Rahmen: alle Szenen ausser Schwelle + Still */
  .home .scene:not(.threshold):not(.scene-still) {
    min-height: 0;
    scroll-snap-align: none;
    padding-top: calc(var(--header-h) + var(--scene-pad-y));
    padding-bottom: var(--scene-pad-y);
    padding-inline: var(--frame-pad);
    box-sizing: border-box;
  }

  .home .scene.threshold,
  .home .scene.scene-still {
    padding-inline: 0;
  }

  .home .scene.run-origem {
    padding-top: calc(var(--header-h) + var(--scene-pad-y));
  }

  .home .scene.scene-contact {
    height: auto;
    min-height: 100svh;
    min-height: 100dvh;
    padding: 0;
    padding-inline: 0;
    overflow: visible;
    display: flex;
  }

  .scene-contact .contact-body,
  .scene-contact .run-kontakt {
    flex: 0 0 auto;
    justify-content: flex-start;
    padding-top: calc(var(--header-h) + var(--scene-pad-y));
    padding-bottom: var(--scene-pad-y);
    padding-inline: var(--frame-pad);
  }

  .scene-contact .run-credits > p > a[href^="mailto:"] {
    width: 100%;
    max-width: 22rem;
    box-sizing: border-box;
  }

  .scene-contact .site-footer,
  .scene-contact .footer {
    position: relative;
    z-index: 3;
  }

  .home main > .run:not(.threshold):not(.scene-still) {
    padding-inline: var(--frame-pad);
  }

  .scene-text,
  .section-grid .run-copy,
  .fig-left,
  .fig-right,
  .fig-full {
    grid-column: 1 / 13;
    grid-row: auto;
  }

  .section-grid,
  .run-pair {
    grid-template-columns: 1fr;
    gap: 2.25rem;
  }

  .run-trio-grid .ratio-square img,
  .run-trio-grid .ratio-34 img {
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: none;
  }

  .ratio-phi {
    width: min(100%, calc(var(--mod-square) * var(--phi)));
    max-width: none;
  }

  .ratio-phi > picture {
    height: var(--mod-square);
  }

  .home .scene .run-figure.ratio-phi img,
  .ratio-phi img {
    width: 100%;
    height: 100%;
    max-height: none;
    aspect-ratio: auto;
  }

  .herkunft-figure {
    width: min(100%, calc(var(--mod-square) * var(--phi)));
  }

  .herkunft-figure picture {
    height: var(--mod-square);
  }

  .herkunft-figure img,
  .herkunft-figure.ratio-phi img {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
  }

  .run-edition .edition-media {
    grid-template-columns: 1fr;
  }

  .run-edition .edition-fig-main,
  .run-edition .edition-fig-side,
  .run-edition .edition-media-alt .edition-fig-main,
  .run-edition .edition-media-alt .edition-fig-side {
    grid-column: 1 / -1;
  }

  .run-edition .edition-fig-main img,
  .run-edition .edition-fig-side img {
    min-height: clamp(14rem, 62vw, 22rem);
  }

  .run-figure figcaption {
    padding-inline: 0;
  }

  .run-intro {
    margin-bottom: 1.75rem;
  }

  .run-pair,
  .run-preorder {
    margin-top: 2rem;
  }

  .run-preorder .path-row .btn,
  .run-edition .path-row .btn {
    width: 100%;
    max-width: 22rem;
    box-sizing: border-box;
    justify-content: center;
  }

  .run h2 {
    max-width: none;
    font-size: var(--fs-title);
  }

  .run-table {
    display: block;
    overflow: visible;
    font-size: inherit;
  }

  .origin-groups {
    grid-template-columns: 1fr;
    gap: 2.75rem;
    max-width: none;
  }

  .run-sheet-title {
    margin-bottom: 2rem;
  }
}

/* Mobile zuletzt: Desktop-Regeln nicht ueberschreiben lassen */
@media (max-width: 768px) {
  /* Schwelle: ein Screen, Lockup längs zentriert (wie Perfumer-H / Editorial) */
  .threshold {
    justify-content: center;
    align-items: center;
    gap: 0;
    height: 100vh;
    height: 100svh;
    min-height: 100vh;
    min-height: 100svh;
    max-height: 100vh;
    max-height: 100svh;
    overflow: hidden;
    padding: calc(var(--header-h) + env(safe-area-inset-top, 0px) + 12px) 20px
      max(28px, env(safe-area-inset-bottom, 0px));
  }

  .lockup {
    --lk: 14px;
  }

  .lockup .landing-logo.wordmark {
    margin-top: 0;
  }

  .lockup .landing-logo.wordmark.wordmark-stempel {
    width: clamp(12.6rem, 64.8vw, 19.8rem);
  }

  .lockup .intro-line {
    margin-top: 10px;
    font-size: calc((clamp(3.18rem, 13.8vw, 4.02rem) * 0.25 - 7px) * 0.9);
  }

  .lockup-mark {
    display: none;
  }

  .season-line {
    min-width: 0;
    width: min(100%, 20rem);
    margin-top: 18px;
    margin-bottom: 0;
    padding-top: 0;
  }

  .coming-soon {
    font-size: var(--fs-kicker);
    letter-spacing: 0.12em;
  }

  .coming-sub {
    margin-top: 6px;
    font-size: var(--fs-body);
    line-height: 1.45;
    max-width: 17rem;
  }

  .threshold-link {
    width: auto;
    min-width: 11.5rem;
    min-height: 44px;
    margin-top: 14px;
    padding: 0.65rem 1.6rem;
    justify-content: center;
  }

  /* Alle Szenen: flacher Dokumentenfluss hintereinander */
  .home .scene:not(.threshold):not(.scene-contact):not(.scene-still) {
    min-height: 0;
    height: auto;
    scroll-snap-align: none;
  }

  /* Haltung: Desktop-Vollhöhe + overflow:hidden schneidet Vormerken ab */
  .home .scene.ground.scene-snap {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }

  .home .scene.run-origem {
    padding-top: calc(var(--header-h) + var(--scene-pad-y));
  }

  /* Text links an der Gutter, Bild randlos über die volle Breite */
  .scene-text,
  .section-grid .run-copy,
  .run-trio .trio-col,
  .run-preorder .run-copy,
  .origin-group {
    text-align: left;
    max-width: none;
  }

  /* Desktop-Spalten aufheben */
  .run-origem .origem-story,
  .run-origem .origem-head,
  .run-origem .origem-media,
  .ground-story {
    grid-template-columns: 1fr;
  }

  .run-origem .origem-head > .edition-kicker,
  .run-origem .origem-head > h2,
  .run-origem .origem-copy,
  .run-origem .origem-fig-main,
  .run-origem .origem-fig-side,
  .run-origem .run-copy,
  .run-edition .run-copy,
  .run-edition .edition-story > .edition-kicker,
  .run-edition .edition-story > h2,
  .ground-story > .edition-kicker,
  .ground-title,
  .ground-story-body,
  .section-grid .run-copy,
  .run-origem .fig-left,
  .run-origem .fig-left.ratio-phi,
  .run-origem .origem-fig,
  .run-edition .fig-right,
  .fig-left,
  .fig-right,
  .fig-full {
    grid-column: 1 / -1;
    grid-row: auto;
    max-width: 100%;
    width: 100%;
    min-width: 0;
    position: static;
  }

    /* Kreis bleibt Kreis — nie auf Spaltenbreite ziehen */
    .ground-circle {
      grid-column: 1 / -1;
      grid-row: auto;
      position: static;
      width: 112px;
      max-width: 112px;
      min-width: 0;
      aspect-ratio: 1 / 1;
      height: auto;
    }

    .ground-story > .zweig {
      grid-column: 1 / -1;
      grid-row: auto;
      justify-self: center;
      width: min(82vw, 26rem);
      margin-top: clamp(1.5rem, 4vh, 2.5rem);
    }

  .run-origem .fig-left,
  .run-origem .origem-fig,
  .run-origem .origem-fig-main,
  .run-origem .origem-fig-side {
    margin-top: 0;
    align-self: stretch;
    width: 100%;
  }

  /*
   * φ-Desktop-Breite (mod × φ) auf Mobile killen.
   * Spezifität muss ≥ Desktop-Regel mit :not() sein, sonst bleibt calc(mod×φ)
   * (~631px) und overflow-x:clip schneidet Text + Bild ab.
   */
  .home .scene:not(.threshold):not(.scene-still) > .run-figure.ratio-phi,
  .home .scene:not(.threshold):not(.scene-still) > figure.run-figure.ratio-phi,
  .home .scene.run-origem:not(.threshold):not(.scene-still) > .run-figure.ratio-phi,
  .home .scene.run-origem:not(.threshold):not(.scene-still) > figure.run-figure.ratio-phi,
  .run-origem .fig-left.ratio-phi,
  .run-origem .origem-fig.ratio-phi,
  .ratio-phi {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    justify-self: stretch;
    box-sizing: border-box;
  }

  .home .scene:not(.threshold):not(.scene-still) > .run-figure.ratio-phi > picture,
  .ratio-phi > picture {
    width: 100%;
    height: auto;
    aspect-ratio: var(--phi) / 1;
  }

  .home .scene.run-origem {
    overflow-x: visible;
  }

  .run-origem .run-copy,
  .run-edition .run-copy,
  .run-trio .trio-col > :not(.run-figure) {
    padding-inline: 0; /* Rahmen sitzt schon an der Szene */
  }

  .run-copy p,
  .run-trio .trio-col p,
  .run-copy .lead {
    max-width: 34rem;
  }

  .edition-kicker,
  .run-trio .trio-col .edition-kicker {
    text-align: left;
  }

  /* Trio bleibt im Rahmen; Origem/Edition-Fotos springen raus */
  .run-trio .run-figure {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    margin-top: 1.75rem;
    margin-bottom: 0.35rem;
  }

  /* Edition-Fotos dürfen bluten; Origem bleibt im Rahmen (sonst Text aus dem Screen) */
  .run-edition .run-figure,
  .home .scene:not(.threshold):not(.scene-still):not(.run-trio):not(.run-origem) > .run-figure {
    width: calc(100% + 2 * var(--frame-pad));
    max-width: none;
    margin-inline: calc(-1 * var(--frame-pad));
    margin-top: 1.75rem;
    margin-bottom: 0.35rem;
  }

  .run-origem .run-figure,
  .run-origem .fig-left.ratio-phi {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    margin-top: 1.75rem;
    margin-bottom: 0.35rem;
  }

  /* Text vor dem Bild: Abstand nach unten */
  .section-grid .run-copy,
  .run-trio .trio-col > .edition-kicker {
    margin-bottom: 0;
  }

  .run-origem .run-copy,
  .run-edition .run-copy {
    margin-bottom: 0.25rem;
  }

  .run-trio .run-figure img,
  .run .run-figure img,
  .run-figure img {
    width: 100%;
    max-width: none;
    height: auto;
    display: block;
  }

  .run-figure figcaption {
    margin-top: 0.65rem;
    margin-bottom: 0.5rem;
    padding-inline: 0;
    box-sizing: border-box;
  }

  .run-figure.fig-left > figcaption,
  .home .run-origem .fig-left > figcaption {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-right: 0;
    text-align: right;
  }

  .run-figure.fig-right > figcaption,
  .home .run-edition .fig-right > figcaption {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: var(--frame-pad);
    text-align: left;
  }

  .home .scene:not(.run-trio) > .run-figure > figcaption {
    padding-inline: 0;
  }

  .ground {
    padding: 3.5rem var(--frame-pad) 3.75rem;
  }

  .ground-lead + .ground-lead {
    margin-top: 1.35rem;
  }

  .ground .path-row {
    margin-top: 1.85rem;
  }

  .ground-meta {
    margin-top: 1.35rem;
  }

  .ground-circle {
    margin-top: 2.25rem;
  }
}

/* Kurzer Screen: Schrift + Vormerken bleiben im einen Bildschirm, nicht abschneiden */
@media (max-width: 768px) and (max-height: 640px) {
  .threshold {
    justify-content: flex-start;
    padding: calc(var(--header-h) + env(safe-area-inset-top, 0px) + 12px) 20px
      max(14px, env(safe-area-inset-bottom, 0px));
  }

  .lockup .landing-logo.wordmark.wordmark-stempel {
    width: clamp(10.8rem, 61.2vw, 16.2rem);
  }

  .lockup .intro-line {
    margin-top: 8px;
    font-size: calc((clamp(2.64rem, 12vw, 3.42rem) * 0.25 - 7px) * 0.9);
  }

  .lockup-mark {
    display: none;
  }

  .season-line {
    margin-top: 12px;
    padding-top: 0;
  }

  .coming-sub {
    margin-top: 4px;
    font-size: 0.98rem;
    line-height: 1.4;
  }

  .threshold-link {
    margin-top: 10px;
    min-height: 44px;
    padding: 0.55rem 1.45rem;
  }
}

@media (max-width: 768px) and (max-height: 520px) {
  .lockup-mark {
    display: none;
  }

  .lockup .landing-logo.wordmark.wordmark-stempel {
    width: clamp(9.45rem, 55.8vw, 13.5rem);
  }

  .lockup .intro-line {
    margin-top: 6px;
    font-size: calc((clamp(2.22rem, 10.8vw, 2.82rem) * 0.25 - 7px) * 0.9);
  }

  .season-line {
    margin-top: 8px;
    padding-top: 0;
  }

  .coming-soon {
    font-size: 0.7rem;
  }

  .coming-sub {
    font-size: 0.9rem;
  }

  .threshold-link {
    margin-top: 8px;
  }
}

/* Herkunft: nicht im Seitenfluss — Panel über Olivenöl-Bild */
.herkunft-panel {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: none;
  margin: 0;
  padding: 0;
  background: rgba(29, 29, 31, 0.28);
  box-sizing: border-box;
}

.herkunft-panel.is-open {
  display: block;
}

.herkunft-panel-inner {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--bg);
  color: var(--text);
  padding: calc(var(--header-h) + env(safe-area-inset-top, 0px) + 1.25rem)
    var(--frame-pad)
    calc(2.5rem + env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
}

.herkunft-close {
  position: sticky;
  top: 0;
  float: right;
  z-index: 2;
  width: 44px;
  height: 44px;
  margin: 0 0 0.5rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
  font-size: 1.75rem;
  line-height: 1;
  cursor: pointer;
}

.herkunft-close:focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 2px;
}

.herkunft-panel .run-sheet-title {
  clear: both;
  margin-top: 0;
}

.trio-col[data-herkunft-trigger] .run-figure {
  cursor: pointer;
}

.trio-col[data-herkunft-trigger] .run-figure:focus-within,
.trio-col[data-herkunft-trigger] .run-figure:focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
}

body.herkunft-open {
  overflow: hidden;
}

@media (min-width: 769px) {
  .herkunft-panel-inner {
    inset: 6vh 12vw auto;
    max-height: 88vh;
    max-width: 52rem;
    margin-inline: auto;
    left: 0;
    right: 0;
    border: 1px solid var(--border);
    padding: 2rem clamp(1.5rem, 3vw, 2.5rem) 2.5rem;
  }
}

/* Sanfte Ankunft beim Scrollen */
[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 1.15rem, 0);
  transition:
    opacity 0.95s var(--ease),
    transform 0.95s var(--ease);
  will-change: opacity, transform;
}

[data-reveal].is-in {
  opacity: 1;
  transform: none;
}

/* Kicker zuerst, Überschrift etwas später, Text/Bild danach */
.edition-kicker[data-reveal],
.intro-line[data-reveal] {
  transition-delay: 0s;
}

h2[data-reveal],
h3[data-reveal],
.ground-title[data-reveal] {
  transition-delay: 0.16s;
}

.origem-media[data-reveal],
.edition-media[data-reveal] {
  transition-delay: 0.08s;
}

.run-copy[data-reveal],
.origem-copy[data-reveal],
.ground-story-body[data-reveal],
.run-credits[data-reveal] {
  transition-delay: 0.28s;
}

.ground-circle[data-reveal],
.contact-figure[data-reveal] {
  transition-delay: 0.36s;
}

[data-reveal-group] > .trio-col {
  opacity: 0;
  transform: translate3d(0, 1rem, 0);
  transition:
    opacity 0.85s var(--ease),
    transform 0.85s var(--ease);
}

[data-reveal-group].is-in > .trio-col {
  opacity: 1;
  transform: none;
}

[data-reveal-group].is-in > .trio-col:nth-child(1) { transition-delay: 0s; }
[data-reveal-group].is-in > .trio-col:nth-child(2) { transition-delay: 0.08s; }
[data-reveal-group].is-in > .trio-col:nth-child(3) { transition-delay: 0.16s; }
[data-reveal-group].is-in > .trio-col:nth-child(4) { transition-delay: 0.24s; }
[data-reveal-group].is-in > .trio-col:nth-child(5) { transition-delay: 0.32s; }
[data-reveal-group].is-in > .trio-col:nth-child(6) { transition-delay: 0.4s; }

/* Manche Bildzeilen mit Innenrand */
.has-edge {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  padding-inline: clamp(0.75rem, 3.5vw, 3.5rem);
}

.run-origem .origem-fig.has-edge,
.run-origem .origem-fig-side.has-edge {
  width: 100%;
  padding-inline: 0;
  margin-inline: 0;
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal-group] > .trio-col {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Ohne site.js kommt nie eine .is-in — dann darf sich nichts verstecken.
   Die Klasse js setzt das Inline-Skript im Kopf. */
:root:not(.js) [data-reveal],
:root:not(.js) [data-reveal-group] > .trio-col {
  opacity: 1;
  transform: none;
  transition: none;
}

/* Bildpaar: Zweitbild als Overlay — Desktop Hover, Mobile Auto-Wechsel */
.run-figure.has-swap {
  position: relative;
  isolation: isolate;
}

.run-figure.has-swap > .swap-alt {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transition: opacity 0.75s var(--ease, cubic-bezier(0.22, 1, 0.36, 1));
  pointer-events: none;
}

.run-figure.has-swap.is-swapped > .swap-alt {
  opacity: 1;
}

.run-trio-grid .run-figure.has-swap > .swap-alt {
  aspect-ratio: 1 / 1;
}

@media (hover: hover) and (pointer: fine) {
  .run-figure.has-swap:hover > .swap-alt,
  .run-figure.has-swap:focus-within > .swap-alt {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .run-figure.has-swap > .swap-alt {
    transition: none;
  }
}