:root {
  --color-ink: #161615;
  --color-muted: #686761;
  --color-paper: #f2f0e9;
  --color-paper-deep: #e8e4da;
  --color-line: rgba(22, 22, 21, 0.18);
  --color-focus: #2457ff;
  --font-display: "Iowan Old Style", "Baskerville", "Times New Roman", serif;
  --font-body: "Helvetica Neue", "Segoe UI", Arial, sans-serif;
  --page-gutter: clamp(1.25rem, 4vw, 5rem);
  --content-width: 46rem;
  --wide-width: 88rem;
  --section-space: clamp(6rem, 13vw, 13rem);
  --section-space-compact: clamp(4rem, 8vw, 8rem);
  --display-size: clamp(4.5rem, 10.5vw, 9.75rem);
  --heading-size: clamp(2.5rem, 5vw, 5.4rem);
  --body-size: clamp(1.08rem, 1.45vw, 1.4rem);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html { scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* MF ART JOURNAL SHELL V1 — scoped; no LOCKED page selectors changed. */
.journal {
  --journal-ink: #11110f;
  --journal-paper: #f2f0e9;
  --journal-signal: #b43a24;
  background: var(--journal-paper);
  color: var(--journal-ink);
  min-height: 100vh;
  overflow: clip;
}

.journal a:focus-visible {
  outline: 3px solid var(--journal-signal);
  outline-offset: 5px;
}

.journal-masthead,
.story-opening {
  padding: clamp(2rem, 6vw, 7rem) clamp(1rem, 4vw, 4rem);
}

.journal-masthead h1,
.story-opening h1 {
  font-size: clamp(3.4rem, 13vw, 11rem);
  letter-spacing: -.075em;
  line-height: .82;
  margin: .35em 0;
  max-width: 12ch;
  overflow-wrap: anywhere;
}

.journal-anchor {
  font-size: clamp(.75rem, 1vw, .95rem);
  letter-spacing: .2em;
}

.journal-nav,
.territory-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.5rem;
  margin-top: 2rem;
}

.journal-nav a,
.territory-nav a {
  color: inherit;
  font-size: .76rem;
  letter-spacing: .12em;
  min-height: 44px;
  padding: .8rem 0;
  text-decoration-thickness: 1px;
  text-underline-offset: .4em;
}

.journal-cover {
  align-items: end;
  background: #171714;
  color: #f8f6ef;
  display: grid;
  grid-template-columns: minmax(14rem, .65fr) minmax(0, 1.35fr);
  min-height: 85vh;
  padding: clamp(1rem, 4vw, 4rem);
}

.journal-cover h2 {
  font-size: clamp(2.5rem, 8vw, 8rem);
  line-height: .9;
  max-width: 8ch;
}

.journal-media {
  margin: 0;
}

.journal-media > div,
.journal-monumental > div {
  align-items: center;
  background: linear-gradient(135deg, #34332f, #161614 65%);
  color: #f8f6ef;
  display: flex;
  justify-content: center;
  min-height: min(70vh, 50rem);
  padding: 2rem;
  text-align: center;
}

.journal-media--motion > div::before {
  content: '▶';
  font-size: 2rem;
  margin-right: 1rem;
}

.journal-media figcaption {
  font-size: .68rem;
  letter-spacing: .1em;
  padding-top: .6rem;
}

.journal-dominant,
.journal-constellation {
  display: grid;
  gap: 1px;
  background: #aaa79e;
}

.journal-dominant { grid-template-columns: 1.45fr .55fr; }
.journal-constellation { grid-template-columns: .8fr 1.2fr .8fr; }

.story-card {
  background: var(--journal-paper);
  min-height: 36rem;
}

.story-card--portrait { min-height: 48rem; }
.story-card--ultrawide { min-height: 24rem; }
.story-card--full-height { min-height: 90vh; }

.story-card a {
  color: inherit;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  height: 100%;
  min-height: inherit;
  padding: clamp(1.25rem, 3vw, 3rem);
  text-decoration: none;
}

/* Keep transformed card shells from intercepting visible content in adjacent cards. */
.story-card > a { pointer-events: none; }
.story-card > a > [data-mf-editor-child] { pointer-events: auto; }
.mf-editor-added-image { position:relative; z-index:1; pointer-events:auto; }
.artist-section-image { display:block; width:min(100%,72rem); margin:0 auto clamp(2rem,6vw,5rem); }
.artist-section-image img { display:block; width:100%; height:auto; max-height:75vh; object-fit:contain; }
.mf-editor-added-text { position:relative; z-index:1; }
.mf-editor-overlay-text { position:absolute; inset:0 auto auto 0; z-index:2; margin:0; color:inherit; text-shadow:0 1px 12px rgba(0,0,0,.32); }
.mf-editor-free-block { position:relative; display:block; width:100%; min-height:14rem; padding:clamp(1rem,3vw,3rem); box-sizing:border-box; }
.mf-editor-deleted { opacity:.18!important; outline:1px dashed #b42318!important; }

.story-card h2 {
  align-self: center;
  font-size: clamp(2rem, 5vw, 6rem);
  letter-spacing: -.055em;
  line-height: .92;
}

.story-card__index,
.story-card__territory,
.story-card__format {
  font-size: .7rem;
  letter-spacing: .12em;
}

.journal-monumental {
  background: #191916;
  color: #f8f6ef;
  min-height: 100svh;
  padding: clamp(1rem, 4vw, 4rem);
}

.journal-monumental > div {
  min-height: calc(100svh - 9rem);
}

.journal-vocabulary,
.word-field,
.story-body,
.story-lead,
.story-footer,
.journal-closing {
  padding: clamp(2rem, 6vw, 7rem) clamp(1rem, 8vw, 9rem);
}

.journal-vocabulary ul {
  columns: 3 14rem;
  list-style: none;
  padding: 0;
}

.journal-vocabulary li {
  border-top: 1px solid currentColor;
  break-inside: avoid;
  font-size: .75rem;
  letter-spacing: .1em;
  padding: .8rem 0;
}

.archive-shelf {
  display: grid;
  padding: clamp(1rem, 4vw, 4rem);
}

.archive-shelf a {
  aspect-ratio: 4 / 5;
  background: #181816;
  color: #f8f6ef;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  max-width: 32rem;
  padding: 2rem;
  text-decoration: none;
}

.story-opening {
  min-height: 78vh;
}

.story-opening h1 { font-size: clamp(3rem, 10vw, 9rem); }
.story-lead, .story-body { margin-inline: auto; max-width: 54rem; }
.story-lead { font-size: clamp(1.35rem, 2.4vw, 2.1rem); }

.editorial-callout {
  border-top: 1px solid currentColor;
  display: grid;
  gap: 1rem;
  grid-template-columns: 10rem 1fr;
  padding: 1rem 0 2rem;
}

@media (max-width: 760px) {
  .journal-masthead h1,
  .story-opening h1 { font-size: clamp(3rem, 20vw, 6rem); }
  .journal-nav { display: grid; grid-template-columns: 1fr 1fr; }
  .territory-nav { gap: .25rem .75rem; }
  .journal-cover { grid-template-columns: 1fr; min-height: 100svh; }
  .journal-cover .journal-media { align-self: stretch; order: -1; }
  .journal-cover .journal-media > div { min-height: 48svh; }
  .journal-dominant { grid-template-columns: 1fr; }
  .journal-constellation { display: flex; flex-direction: column; }
  .story-card { min-height: 32rem; }
  .story-card--portrait { min-height: 72svh; }
  .story-card--ultrawide { min-height: 20rem; }
  .story-card--full-height { min-height: 92svh; }
  .journal-monumental { min-height: 100svh; }
  .editorial-callout { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .journal *, .journal *::before, .journal *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

* {
  box-sizing: border-box;
}

html {
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 82% 7%, rgba(255, 255, 255, 0.8), transparent 31rem),
    var(--color-paper);
  color: var(--color-ink);
  text-rendering: optimizeLegibility;
}

a {
  color: inherit;
}

a:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 5px;
}

.skip {
  position: fixed;
  z-index: 100;
  top: 1rem;
  left: -9999px;
  padding: 0.75rem 1rem;
  background: var(--color-ink);
  color: var(--color-paper);
}

.skip:focus {
  left: 1rem;
}

body > header {
  position: relative;
  z-index: 20;
  border-bottom: 1px solid var(--color-line);
}

body > header nav {
  width: min(100%, var(--wide-width));
  min-height: 5rem;
  margin: 0 auto;
  padding: 1rem var(--page-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
}

body > header nav > a,
.visions-menu a,
.visions-menu summary,
.opera-menu a,
.opera-menu summary {
  text-decoration: none;
  text-transform: uppercase;
}

.visions-menu,
.opera-menu {
  position: relative;
}

.visions-menu {
  margin-left: auto;
}

.visions-menu summary,
.opera-menu summary {
  cursor: pointer;
  list-style: none;
}

.visions-menu summary { display:flex; align-items:center; gap:.5rem; }
.visions-menu summary > a { color:inherit; text-decoration:none; }
.visions-menu summary > span { display:inline-block; padding:.35rem; font-size:1rem; line-height:1; }

.visions-menu summary::-webkit-details-marker,
.opera-menu summary::-webkit-details-marker {
  display: none;
}

.visions-menu[open],
.opera-menu[open] {
  padding-top: 6.5rem;
}

.visions-menu[open] summary,
.opera-menu[open] summary {
  position: absolute;
  top: 0;
  right: 0;
}

.visions-menu a,
.opera-menu a {
  display: block;
  min-width: 15rem;
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--color-line);
  text-align: right;
}

body > header nav a[aria-current="page"],
.visions-menu[data-active="true"] summary,
.opera-menu[data-active="true"] summary {
  border-bottom: 1px solid currentColor;
}

main {
  display: block;
}

.home-announcement-ribbon {
  display: block;
  min-height: 2.75rem;
  overflow: hidden;
  border-bottom: 1px solid var(--color-line);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: clamp(.62rem, .75vw, .72rem);
  font-weight: 600;
  letter-spacing: .12em;
  line-height: 1.25;
  text-decoration: none;
  text-transform: uppercase;
}

.home-announcement-ribbon__track {
  display: flex;
  width: max-content;
  white-space: pre;
  animation: home-announcement-marquee 42s linear infinite;
  will-change: transform;
}

.home-announcement-ribbon__text {
  display: block;
  padding: .75rem var(--page-gutter);
}

.home-announcement-ribbon:hover .home-announcement-ribbon__track {
  animation-play-state: paused;
}

.home-announcement-ribbon:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -3px;
}

@keyframes home-announcement-marquee {
  to { transform: translateX(-50%); }
}

main article {
  width: 100%;
}

main section {
  width: min(100%, var(--wide-width));
  margin: 0 auto;
  padding: var(--section-space) var(--page-gutter);
  border-bottom: 1px solid var(--color-line);
}

main section > * {
  max-width: var(--content-width);
}

main section > :first-child {
  margin-top: 0;
}

main section > :last-child {
  margin-bottom: 0;
}

.eyebrow {
  margin-bottom: clamp(2rem, 5vw, 4.5rem);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.2em;
  line-height: 1.4;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  text-wrap: balance;
}

h1,
h2 {
  margin: 0 0 clamp(2rem, 5vw, 4.5rem);
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.045em;
}

main section > h1 {
  max-width: 15ch;
  font-size: var(--display-size);
  line-height: 0.88;
}

main section > h2 {
  max-width: 26ch;
  font-size: var(--heading-size);
  line-height: 0.98;
}

[data-home-section="07-artist"] h2 {
  max-width: 24ch;
}

h3 {
  margin: clamp(3.5rem, 8vw, 7rem) 0 1rem;
  font-size: clamp(1rem, 1.8vw, 1.35rem);
  font-weight: 650;
  letter-spacing: 0.08em;
  line-height: 1.25;
  text-transform: uppercase;
}

main p {
  margin: 0 0 1.15rem;
  font-size: var(--body-size);
  font-weight: 400;
  line-height: 1.55;
  text-align: left;
  text-wrap: pretty;
}

main p strong {
  font-weight: 550;
}

main section > a,
main section > p > a {
  display: inline-block;
  margin-top: clamp(1.5rem, 3vw, 3rem);
  padding: 0.75rem 0 0.65rem;
  border-bottom: 1px solid currentColor;
  font-size: 0.76rem;
  font-weight: 650;
  letter-spacing: 0.16em;
  line-height: 1.35;
  text-decoration: none;
  text-transform: uppercase;
  transition: opacity 180ms var(--ease), transform 180ms var(--ease);
}

main section > a:hover,
main section > p > a:hover {
  opacity: 0.55;
  transform: translateX(0.2rem);
}

[data-home-section="01-hero"],
[data-visions-section="01-hero"] {
  min-height: calc(100svh - 5rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

[data-home-section="01-hero"] > p:not(.eyebrow),
[data-visions-section="01-hero"] > p {
  max-width: 34rem;
}

[data-home-section="03-visions"],
[data-home-section="04-opera"],
[data-home-section="07-artist"],
[data-visions-section="02-vibrism-the-field"],
[data-visions-section="04-archetypes-the-recognition"],
[data-visions-section="08-metamorphosis-the-expansion"] {
  min-height: 90svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

[data-home-section="03-visions"],
[data-home-section="07-artist"],
[data-visions-section="04-archetypes-the-recognition"],
[data-visions-section="09-one-research"] {
  background: var(--color-ink);
  color: var(--color-paper);
  box-shadow: 50vw 0 0 var(--color-ink), -50vw 0 0 var(--color-ink);
}

[data-home-section="05-opera-individuo-spazio"],
[data-visions-section="05-opera-individuo-spazio"] {
  min-height: 80svh;
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
}

[data-home-section="05-opera-individuo-spazio"] > *,
[data-visions-section="05-opera-individuo-spazio"] > * {
  max-width: 54rem;
}

[data-home-section="10-closing-field"],
[data-visions-section="10-next-threshold"] {
  min-height: 70svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.transition {
  min-height: 72svh;
  display: grid;
  place-items: center;
  text-align: center;
}

.transition p {
  max-width: 21ch;
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 5vw, 5rem);
  letter-spacing: -0.035em;
  line-height: 1.04;
  text-align:center;
  text-wrap:balance;
}

[data-visions-section="06-constellation"] {
  width: min(100%, 64rem);
  padding-top: var(--section-space-compact);
  padding-bottom: var(--section-space-compact);
}

.statement-unit {
  margin-top: clamp(4rem, 9vw, 8rem);
  padding-top: clamp(2rem, 5vw, 4rem);
  border-top: 1px solid currentColor;
}

.statement-unit p {
  max-width: 26ch;
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3.5vw, 3.4rem);
  letter-spacing: -0.025em;
  line-height: 1.08;
}

body > footer {
  width: min(100%, var(--wide-width));
  margin: 0 auto;
  padding: 4rem var(--page-gutter);
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.18em;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  flex-wrap:wrap;
}

.back-to-top,.footer-privacy { color:inherit; text-decoration:none; white-space:nowrap; border-bottom:1px solid currentColor; padding:.4rem 0; }
.back-to-top:hover,.footer-privacy:hover { opacity:.6; }
.back-to-top:focus-visible,.footer-privacy:focus-visible { outline:2px solid var(--color-focus); outline-offset:4px; }

@media (max-width: 48rem) {
  :root {
    --page-gutter: 1.25rem;
    --section-space: clamp(5rem, 24vw, 8rem);
    --display-size: clamp(3.7rem, 19vw, 6.5rem);
    --heading-size: clamp(2.45rem, 12vw, 4.5rem);
    --body-size: 1.06rem;
  }

  body > header nav {
    min-height: 4.5rem;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 1rem;
  }

  body > header nav > a:first-child {
    margin-right: auto;
  }

  .visions-menu {
    margin-left: 0;
  }

  .visions-menu[open],
  .opera-menu[open] {
    padding-top: 5.5rem;
  }

  .visions-menu a,
  .opera-menu a {
    min-width: 12rem;
  }

  main section {
    min-height: auto;
  }

  [data-home-section="01-hero"],
  [data-visions-section="01-hero"] {
    min-height: calc(100svh - 4.5rem);
  }

  [data-archetypes-section="01-hero"] h1 {
    font-size: clamp(3.35rem, 14vw, 6.5rem);
  }

  [data-metamorphosis-section="01-hero"] h1 {
    font-size: clamp(2.65rem, 11vw, 6.5rem);
  }

  main h1,
  main h2,
  main h3 {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  [data-home-section="03-visions"],
  [data-home-section="04-opera"],
  [data-home-section="07-artist"],
  [data-visions-section="02-vibrism-the-field"],
  [data-visions-section="04-archetypes-the-recognition"],
  [data-visions-section="08-metamorphosis-the-expansion"] {
    min-height: 78svh;
  }

  .transition {
    min-height: 62svh;
  }
}

/* Editor-authored offsets are calibrated for wide canvases. Keep the same
   content and hierarchy while preventing those inline coordinates from
   clipping text or media at ordinary desktop, tablet and mobile widths. */
@media (max-width: 100rem) {
  [data-mf-editor-block-id] {
    max-width: 100% !important;
    scale: 1 !important;
    translate: none !important;
  }

  :is(p, h1, h2, h3, h4, h5, h6, a, span, blockquote)[data-mf-editor-block-id] {
    width: auto !important;
  }

  :is(img, picture, figure, video)[data-mf-editor-block-id] {
    height: auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .home-announcement-ribbon__track {
    display: block;
    width: auto;
    animation: none;
    white-space: pre-wrap;
  }

  .home-announcement-ribbon__text[aria-hidden="true"] {
    display: none;
  }
}

/* DIALOGUE — local relational UX calibration. */
[data-dialogue-section] {
  width: min(100%, var(--wide-width));
}

[data-dialogue-section="01-hero"] {
  min-height: min(60svh, 42rem);
  padding-top: clamp(4.5rem, 8vw, 7.5rem);
  padding-bottom: clamp(4.5rem, 8vw, 7.5rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

[data-dialogue-section="01-hero"] > h1 {
  max-width: 23ch;
  margin-bottom: clamp(1.5rem, 2.8vw, 2.5rem);
  font-size: clamp(3.1rem, 6.3vw, 6.25rem);
  line-height: 0.94;
}

[data-dialogue-section="01-hero"] > .eyebrow {
  margin-bottom: clamp(1.25rem, 2.5vw, 2.25rem);
}

[data-dialogue-section="02-intents"] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  padding: 0 var(--page-gutter);
  border: 0;
  background: var(--color-line);
}

[data-dialogue-section="02-intents"] > [data-dialogue-intent] {
  min-width: 0;
  min-height: clamp(15rem, 22vw, 20rem);
  margin: 0;
  padding: clamp(2rem, 4vw, 4rem);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: var(--color-paper);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color 180ms var(--ease), color 180ms var(--ease), box-shadow 180ms var(--ease);
}

[data-dialogue-section="02-intents"] > [data-dialogue-intent] h2 {
  max-width: 24ch;
  margin: 0;
  font-family: var(--font-body);
  font-size: clamp(0.82rem, 1.25vw, 1.02rem);
  font-weight: 650;
  letter-spacing: 0.12em;
  line-height: 1.3;
  text-transform: uppercase;
}

[data-dialogue-section="02-intents"] > [data-dialogue-intent] span {
  max-width: 34rem;
  font-size: clamp(1rem, 1.35vw, 1.22rem);
  line-height: 1.5;
}

[data-dialogue-section="02-intents"] > [data-dialogue-intent]:hover,
[data-dialogue-section="02-intents"] > [data-dialogue-intent][aria-pressed="true"] {
  background: var(--color-ink);
  color: var(--color-paper);
}

[data-dialogue-section="02-intents"] > [data-dialogue-intent]:focus-visible,
.dialogue-submit:focus-visible,
[data-dialogue-form] input:focus-visible,
[data-dialogue-form] textarea:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 5px;
}

[data-dialogue-section="03-form"] {
  padding-top: clamp(5rem, 10vw, 9rem);
  padding-bottom: clamp(5rem, 10vw, 9rem);
}

[data-dialogue-form] {
  width: min(100%, 52rem);
  display: grid;
  gap: clamp(2rem, 3.5vw, 3rem);
}

[data-dialogue-form] label {
  display: grid;
  gap: 0.85rem;
  font-size: 0.76rem;
  font-weight: 650;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-transform: uppercase;
}

[data-dialogue-form] label > span {
  color: var(--color-muted);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.1em;
}

[data-dialogue-form] input:not([type="hidden"]),
[data-dialogue-form] textarea {
  width: 100%;
  padding: 0.8rem 0;
  border: 0;
  border-bottom: 1px solid var(--color-line);
  border-radius: 0;
  appearance: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: clamp(1.1rem, 1.5vw, 1.3rem);
  line-height: 1.5;
}

[data-dialogue-form] input[readonly] {
  color: var(--color-ink);
  border-bottom-color: currentColor;
}

[data-dialogue-form] textarea {
  min-height: clamp(12rem, 24vw, 18rem);
  resize: vertical;
}

[data-dialogue-form] input::placeholder {
  color: var(--color-muted);
  opacity: 1;
}

.dialogue-submit {
  width: fit-content;
  margin-top: clamp(1rem, 2vw, 2rem);
  padding: 0.75rem 0 0.65rem;
  border: 0;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  appearance: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 650;
  letter-spacing: 0.16em;
  line-height: 1.35;
  text-transform: uppercase;
  cursor: pointer;
  transition: opacity 180ms var(--ease), transform 180ms var(--ease);
}

.dialogue-submit:hover {
  opacity: 0.55;
  transform: translateX(0.2rem);
}

[data-dialogue-form] > [data-privacy-policy-status="PENDING"] {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
}

.dialogue-honeypot {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.dialogue-form-status,
.dialogue-privacy {
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.6;
  letter-spacing: 0.04em;
}

.dialogue-form-status[data-state="error"] { color: #8f2f26; }
.dialogue-form-status[data-state="pending"] { color: var(--color-muted); }
.dialogue-privacy { color: var(--color-muted); }
.dialogue-privacy a { color: inherit; text-underline-offset: 0.25em; }

.privacy-policy { max-width: min(46rem, 100%); margin-inline: auto; }
.privacy-policy header { margin-bottom: clamp(2.5rem, 6vw, 5rem); }
.privacy-policy header > p:last-child { color: var(--color-muted); }
.privacy-policy section { margin-top: clamp(2.25rem, 5vw, 4rem); }
.privacy-policy h2 { font-size: .75rem; letter-spacing: .14em; }
.privacy-policy p,.privacy-policy li { max-width: 42rem; }
.privacy-policy ul { padding-left: 1.25rem; }

/* PRIVATE ROOM · launch placeholder */
.private-room-page { width:100%; }
.private-room-intro {
  width:min(100%,var(--wide-width));
  min-height:calc(100svh - 7rem);
  margin-inline:auto;
  padding:clamp(4rem,9vw,9rem) var(--page-gutter);
  display:grid;
  grid-template-columns:minmax(0,.86fr) minmax(18rem,.64fr);
  align-items:center;
  gap:clamp(3rem,8vw,9rem);
}
.private-room-copy { max-width:42rem; }
.private-room-copy h1 {
  margin:0 0 clamp(3rem,7vw,6rem);
  font-size:clamp(3.8rem,8.8vw,8.5rem);
  line-height:.86;
  letter-spacing:-.055em;
}
.private-room-copy p { max-width:34rem; }
.private-room-lead {
  margin-bottom:clamp(2rem,4vw,3.5rem);
  font-family:var(--font-display);
  font-size:clamp(2rem,3.8vw,3.8rem);
  line-height:1.05;
  letter-spacing:-.03em;
}
.private-room-status {
  margin-top:clamp(3rem,6vw,5rem);
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.16em;
}
.private-room-cta {
  display:inline-block;
  min-height:44px;
  margin-top:clamp(1.5rem,3vw,2.5rem);
  padding:.8rem 0 .55rem;
  color:inherit;
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.16em;
  text-decoration:none;
  border-bottom:1px solid currentColor;
}
.private-room-cta:hover { opacity:.6; }
.private-room-cta:focus-visible { outline:2px solid var(--color-focus); outline-offset:5px; }
.private-room-visual { margin:0; justify-self:end; width:min(100%,32rem); }
.private-room-visual img { display:block; width:100%; height:auto; max-height:75svh; object-fit:contain; }

@media (max-width: 54rem) {
  .private-room-intro { grid-template-columns:1fr; min-height:auto; }
  .private-room-visual { justify-self:center; width:min(100%,38rem); }
}

[data-dialogue-section="04-closing"][hidden] { display: none !important; }

[data-dialogue-section="04-closing"] {
  min-height: 45svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

@media (max-width: 720px) {
  [data-dialogue-section="01-hero"] {
    min-height: auto;
  }

  [data-dialogue-section="01-hero"] > h1 {
    max-width: 15ch;
    font-size: clamp(3rem, 13vw, 4.75rem);
  }

  [data-dialogue-section="02-intents"] {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-dialogue-section="02-intents"] > [data-dialogue-intent] {
    min-height: 13rem;
    padding: clamp(1.75rem, 7vw, 2.5rem);
  }
}

/* JOURNAL · Visual Calibration Patch 01 — component-scoped recomposition. */
.journal-masthead > .eyebrow {
  font-size: clamp(0.95rem, 1.25vw, 1.15rem);
  font-weight: 650;
  letter-spacing: 0.18em;
  line-height: 1.2;
}

.journal-cover {
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
}

.journal-cover > div,
.journal-cover .journal-media,
.story-card,
.story-card a {
  min-width: 0;
}

.journal-cover > div {
  max-width: 100%;
}

.journal-cover h2 {
  max-width: 10ch;
  font-size: clamp(2.35rem, 5.2vw, 6.4rem);
  hyphens: none;
  overflow-wrap: normal;
  text-wrap: balance;
}

.story-card {
  container-type: inline-size;
}

.story-card a {
  padding: clamp(1.7rem, 4.5cqi, 3.5rem);
}

.story-card h2 {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.journal-dominant .story-card h2 {
  font-size: clamp(2.35rem, 9cqi, 5.5rem);
  line-height: 0.9;
}

.journal-constellation .story-card h2 {
  font-size: clamp(2rem, 10cqi, 4.75rem);
  line-height: 0.92;
}

@media (min-width: 761px) and (max-width: 960px) {
  .journal-dominant {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  }

  .journal-constellation {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  }

  .journal-constellation .story-card:last-child {
    grid-column: 1 / -1;
    min-height: 30rem;
  }
}

@media (max-width: 760px) {
  .journal-masthead > .eyebrow {
    font-size: 0.95rem;
  }

  .journal-cover > div {
    max-width: 100%;
  }

  .journal-cover h2 {
    max-width: 10ch;
    font-size: clamp(2.6rem, 13vw, 4.8rem);
  }

  .journal-dominant .story-card h2,
  .journal-constellation .story-card h2 {
    font-size: clamp(2.55rem, 13vw, 4.8rem);
  }
}

/* Issue 01 content-led montage: media remains a subtle capability until assets arrive. */
.journal-current--issue01 .journal-cover { min-height:clamp(16rem,35vw,32rem); display:grid; place-items:end start; }
.journal-current--issue01 .journal-cover > div { max-width:min(100%,52rem); padding:clamp(1.5rem,5vw,5rem); }
.journal-current--issue01 .journal-cover h2 { max-width:100%; overflow-wrap:anywhere; font-size:clamp(2.4rem,8vw,8rem); line-height:.88; }
.journal-question { max-width:30ch; margin:1.5rem 0 0; }
.journal-dominant--soglie { grid-template-columns:minmax(0,1fr); min-height:clamp(28rem,62vw,58rem); }
.journal-dominant--soglie .story-card { min-height:inherit; }
.journal-montage { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); }
.journal-montage .story-card { min-width:0; }
.story-card--issue-3 { grid-row:span 2; min-height:clamp(25rem,48vw,48rem); }
.story-card--issue-4 { min-height:clamp(18rem,26vw,28rem); }
.story-card--issue-5 { min-height:clamp(20rem,30vw,32rem); }
.story-card--issue-2 h2 { font-size:clamp(2.5rem,7cqi,6.4rem); }
.story-card--issue-3 h2 { font-size:clamp(3rem,9cqi,8rem); }
.story-card--issue-4 h2,.story-card--issue-5 h2 { font-size:clamp(2.1rem,5.5cqi,4.8rem); overflow-wrap:anywhere; }
.asset-pending { margin:0 auto; width:min(100% - 2rem,72rem); padding:clamp(1.25rem,3vw,2.5rem) 0; border-block:1px solid currentColor; display:flex; justify-content:space-between; gap:1rem; text-transform:uppercase; letter-spacing:.08em; font-size:.7rem; }
.asset-pending--motion { margin-top:clamp(2rem,7vw,7rem); }
.journal-story .story-opening { min-height:0; padding-bottom:clamp(2rem,5vw,5rem); }
.journal-story .story-body { max-width:46rem; margin:clamp(3rem,8vw,9rem) auto; padding-inline:1rem; }
.journal-story .story-body p { max-width:42ch; font-size:clamp(1.08rem,1.55vw,1.35rem); line-height:1.62; }
.journal-story .story-body h2 { max-width:25ch; margin:clamp(3rem,8vw,8rem) 0 1.3rem; font-size:clamp(1.7rem,4vw,3.6rem); line-height:.98; overflow-wrap:anywhere; }
.metadata-pending { font-size:.65rem; letter-spacing:.1em; opacity:.65; }
.visual-experience { margin:clamp(3rem,8vw,8rem) 0; padding:1.25rem 0; border-block:1px solid currentColor; display:grid; gap:.5rem; font-size:.72rem; letter-spacing:.08em; }
.visual-experience span { opacity:.68; }
.journal-slideshow { width:min(100% - 2rem,72rem); margin:clamp(3rem,8vw,9rem) auto; outline:none; }
.journal-slideshow[hidden] { display:none; }
.journal-slideshow--editor-empty { min-height:8rem; border:1px dashed color-mix(in srgb,var(--journal-ink) 45%,transparent); display:grid; place-items:center; padding:1rem; cursor:pointer; }
.journal-slideshow--editor-empty .journal-slideshow__stage { min-height:0; background:none; font-size:.72rem; letter-spacing:.12em; }
.journal-slideshow__stage { min-height:12rem; display:grid; place-items:center; background:color-mix(in srgb,var(--journal-ink) 4%,var(--journal-paper)); }
.journal-slideshow__slide { grid-area:1 / 1; width:100%; margin:0; display:grid; place-items:center; }
.journal-slideshow__slide[hidden] { display:none; }
.journal-slideshow__stage img { display:block; max-width:100%; max-height:min(72vh,58rem); width:auto; height:auto; object-fit:contain; }
.journal-media-slot { width:min(100%,72rem); margin:clamp(2rem,6vw,6rem) auto; }
.journal-media-slot[hidden] { display:none; }
.journal-media-slot__stage { display:grid; place-items:center; min-height:0; }
.journal-media-slot__stage img { display:block; width:auto; height:auto; max-width:100%; max-height:none; object-fit:contain; filter:none; }
.journal-media-slot figcaption { margin-top:.7rem; white-space:pre-line; font-size:.68rem; line-height:1.55; letter-spacing:.06em; }
.journal-media-slot--editor-empty { display:block!important; min-height:8rem; border:1px dashed color-mix(in srgb,var(--journal-ink) 45%,transparent); padding:1rem; cursor:pointer; }
.journal-media-slot--editor-empty .journal-media-slot__stage { min-height:6rem; font-size:.7rem; letter-spacing:.1em; text-align:center; }
.journal-slideshow__controls { display:grid; grid-template-columns:3rem 1fr 3rem; align-items:center; margin-top:.75rem; border-block:1px solid currentColor; }
.journal-slideshow__controls button { appearance:none; border:0; background:none; color:inherit; min-height:2.75rem; font:inherit; font-size:1.25rem; cursor:pointer; }
.journal-slideshow__controls button:focus-visible { outline:2px solid var(--journal-signal); outline-offset:-2px; }
.journal-slideshow__controls span { text-align:center; font-size:.72rem; letter-spacing:.12em; }
.journal-slideshow__meta { max-width:42ch; margin:1rem 0 0; font-size:.82rem; line-height:1.45; }
.journal-slideshow__meta p { margin:.2rem 0; }
.journal-slideshow__meta p:last-child { opacity:.66; }
@media (max-width:760px) { .journal-slideshow { width:min(100% - 1.5rem,72rem); } .journal-slideshow__stage img { max-height:64vh; } }
@media (max-width:760px) { .journal-montage { grid-template-columns:minmax(0,1fr); } .story-card--issue-3 { grid-row:auto; } .asset-pending { flex-direction:column; } }

/* HOME · HQ-approved visual asset ingest. Image composition governs each field. */
[data-home-section] .home-visual { width:100%; max-width:none; margin:clamp(2rem,5vw,5rem) 0; }
[data-home-section] .home-visual picture,[data-home-section] .home-visual img { display:block; width:100%; height:auto; }
[data-home-section="01-hero"] .home-visual--hero { order:-1; margin-top:0; }
[data-home-section="01-hero"] .home-visual--hero img { min-height:clamp(22rem,56vw,48rem); object-fit:cover; object-position:center; }
[data-home-section="02-the-field"] .home-visual--matter { width:min(100%,68rem); margin-inline:auto; }
[data-home-section="02-the-field"] .home-visual--matter img { max-height:48rem; object-fit:contain; object-position:center; }
[data-home-section="03-visions"] .home-visual--visions { width:min(100%,68rem); }
[data-home-section="03-visions"] .home-visual--vibrism { width:min(100%,52rem); margin-inline:auto; }
[data-home-section="03-visions"] .home-visual--archetypes,[data-home-section="03-visions"] .home-visual--metamorphosis { width:min(100%,62rem); }
[data-home-section="04-opera"] .home-visual--work { width:min(100%,68rem); }
[data-home-section="05-opera-individuo-spazio"] .home-visual--exhibition { width:min(100%,72rem); margin-inline:auto; }
[data-home-section="05-opera-individuo-spazio"] .home-visual--trajectory { width:min(100%,68rem); margin-inline:auto; }
[data-home-section="07-artist"] .home-visual--artist { width:min(100%,56rem); margin-inline:auto; }
@media (max-width:48rem) { [data-home-section="01-hero"] .home-visual--hero img { min-height:32rem; object-position:center; } [data-home-section="02-the-field"] .home-visual--matter,[data-home-section="03-visions"] .home-visual--vibrism,[data-home-section="05-opera-individuo-spazio"] .home-visual--trajectory,[data-home-section="07-artist"] .home-visual--artist { width:100%; margin-left:0; } }

/* VISIONS · HQ-approved real visual assets. Each field keeps its own measure. */
[data-visions-section] .visions-visual { width:100%; max-width:none; margin:clamp(2.5rem,6vw,6rem) 0; }
[data-visions-section] .visions-visual picture,
[data-visions-section] .visions-visual img { display:block; width:100%; height:auto; }
[data-visions-section="01-hero"] .visions-visual--hero { width:min(100%,80rem); margin:0 auto clamp(3rem,7vw,7rem); }
[data-visions-section="02-vibrism-the-field"] .visions-visual--vibrism { width:min(100%,52rem); margin-inline:auto; }
[data-visions-section="04-archetypes-the-recognition"] .visions-visual--archetypes { width:min(100%,76rem); margin-inline:auto; }
[data-visions-section="08-metamorphosis-the-expansion"] .visions-visual--metamorphosis { width:min(100%,56rem); margin-inline:auto; }
[data-visions-section="09-one-research"] .visions-visual--three-movements { width:min(100%,72rem); margin-inline:auto; }
[data-visions-section="10-next-threshold"] .visions-visual--opera { width:min(100%,80rem); margin-inline:auto; }
@media (max-width:48rem) {
  [data-visions-section] .visions-visual,
  [data-visions-section="01-hero"] .visions-visual--hero,
  [data-visions-section="02-vibrism-the-field"] .visions-visual--vibrism,
  [data-visions-section="04-archetypes-the-recognition"] .visions-visual--archetypes,
  [data-visions-section="08-metamorphosis-the-expansion"] .visions-visual--metamorphosis,
  [data-visions-section="09-one-research"] .visions-visual--three-movements,
  [data-visions-section="10-next-threshold"] .visions-visual--opera { width:100%; margin-inline:0; }
}

/* VIBRISM · HQ-approved real visual assets. Measures follow each source composition. */
[data-vibrism-section] .vibrism-visual { width:100%; max-width:none; margin:clamp(2.5rem,6vw,6rem) 0; }
[data-vibrism-section] .vibrism-visual picture,
[data-vibrism-section] .vibrism-visual img { display:block; width:100%; height:auto; }
[data-vibrism-section="01-hero"] .vibrism-visual--hero { width:min(100%,56rem); margin:0 auto clamp(3rem,7vw,7rem); }
[data-vibrism-section="02-origin"] .vibrism-visual--1999 { width:min(100%,76rem); margin-inline:auto; }
[data-vibrism-section="04-the-four-principles"] .vibrism-visual--principles { width:min(100%,52rem); margin-inline:auto; }
[data-vibrism-section="05-opera-individuo-spazio"] .vibrism-visual--immersive { width:min(100%,68rem); margin-inline:auto; }
[data-vibrism-section="06-art-perception-science"] .vibrism-visual--neuroscience { width:min(100%,76rem); margin-inline:auto; }
[data-vibrism-section="07-the-presence"] .vibrism-visual--presence { width:min(100%,80rem); margin-inline:auto; }
@media (max-width:48rem) {
  [data-vibrism-section] .vibrism-visual,
  [data-vibrism-section="01-hero"] .vibrism-visual--hero,
  [data-vibrism-section="02-origin"] .vibrism-visual--1999,
  [data-vibrism-section="04-the-four-principles"] .vibrism-visual--principles,
  [data-vibrism-section="05-opera-individuo-spazio"] .vibrism-visual--immersive,
  [data-vibrism-section="06-art-perception-science"] .vibrism-visual--neuroscience,
  [data-vibrism-section="07-the-presence"] .vibrism-visual--presence { width:100%; margin-inline:0; }
}

/* ARCHETYPES · HQ-approved real visual assets. Each visual follows its native composition. */
[data-archetypes-section] .archetypes-visual { width:100%; max-width:none; margin:clamp(2.5rem,6vw,6rem) 0; }
[data-archetypes-section] .archetypes-visual picture,
[data-archetypes-section] .archetypes-visual img { display:block; width:100%; height:auto; }
[data-archetypes-section="01-hero"] .archetypes-visual--hero { width:min(100%,80rem); margin:0 auto clamp(3rem,7vw,7rem); }
[data-archetypes-section="02-recognition"] .archetypes-visual--persona { width:min(100%,58rem); margin-inline:auto; }
[data-archetypes-section="06-constellation"] .archetypes-visual--spazio { width:min(100%,80rem); margin-inline:auto; }
[data-archetypes-section="11-next-threshold"] .archetypes-visual--superficie { width:min(100%,80rem); margin-inline:auto; }
@media (max-width:48rem) {
  [data-archetypes-section] .archetypes-visual,
  [data-archetypes-section="01-hero"] .archetypes-visual--hero,
  [data-archetypes-section="02-recognition"] .archetypes-visual--persona,
  [data-archetypes-section="06-constellation"] .archetypes-visual--spazio,
  [data-archetypes-section="11-next-threshold"] .archetypes-visual--superficie { width:100%; margin-inline:0; }
}

/* METAMORPHOSIS · HQ-approved real visual assets. Native composition governs every field. */
[data-metamorphosis-section] .metamorphosis-visual { width:100%; max-width:none; margin:clamp(2.5rem,6vw,6rem) 0; }
[data-metamorphosis-section] .metamorphosis-visual picture,
[data-metamorphosis-section] .metamorphosis-visual img { display:block; width:100%; height:auto; }
[data-metamorphosis-section="01-hero"] .metamorphosis-visual--hero { width:min(100%,80rem); margin:0 auto clamp(3rem,7vw,7rem); }
[data-metamorphosis-section="04-expanded-language"] .metamorphosis-visual--immersive,
[data-metamorphosis-section="05-technology"] .metamorphosis-visual--technology,
[data-metamorphosis-section="06-expanded-experience"] .metamorphosis-visual--transformation { width:min(100%,80rem); margin-inline:auto; }
[data-metamorphosis-section="12-next-threshold"] .metamorphosis-visual--origin { width:min(100%,58rem); margin-inline:auto; }
@media (max-width:48rem) {
  [data-metamorphosis-section] .metamorphosis-visual,
  [data-metamorphosis-section="01-hero"] .metamorphosis-visual--hero,
  [data-metamorphosis-section="04-expanded-language"] .metamorphosis-visual--immersive,
  [data-metamorphosis-section="05-technology"] .metamorphosis-visual--technology,
  [data-metamorphosis-section="06-expanded-experience"] .metamorphosis-visual--transformation,
  [data-metamorphosis-section="12-next-threshold"] .metamorphosis-visual--origin { width:100%; margin-inline:0; }
}

/* OPERA · TODAY — canonical two-panel artwork cards. */
[data-opera-section="02-today"] { width:min(100%,var(--wide-width)); }
[data-opera-section="02-today"] > h2 { max-width:none; }
[data-opera-section="02-today"] > .works-card { max-width:none; margin:clamp(4rem,9vw,9rem) 0 0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); border-top:1px solid var(--color-line); }
[data-opera-section="02-today"] > .works-card:last-child { border-bottom:1px solid var(--color-line); }
.works-card__panel { min-width:0; padding:clamp(1.25rem,3.5vw,3.5rem); }
.works-card__panel--ambientazione { border-left:1px solid var(--color-line); }
.works-card__label { margin:0 0 clamp(1.5rem,3vw,3rem); font-size:.68rem; font-weight:650; letter-spacing:.16em; text-transform:uppercase; }
.works-card__visual { width:100%; max-width:none; margin:0 0 clamp(2rem,4vw,4rem); }
.works-card__visual picture,.works-card__visual img { display:block; width:100%; height:auto; }
.works-card__panel--opera .works-card__visual img { object-fit:contain; }
.works-card h3 { max-width:20ch; margin:0 0 1rem; font-family:var(--font-display); font-size:clamp(2.2rem,4.5vw,5.2rem); font-weight:400; letter-spacing:-.045em; line-height:.94; }
.works-card__subline { max-width:32ch; margin-bottom:clamp(2rem,4vw,4rem); font-family:var(--font-display); font-size:clamp(1.2rem,2.1vw,2rem); line-height:1.12; }
.works-card h4 { margin:clamp(2rem,4vw,4rem) 0 .7rem; font-size:.7rem; font-weight:650; letter-spacing:.15em; text-transform:uppercase; }
.works-card h4 + p { max-width:44rem; }
@media (max-width:48rem) { [data-opera-section="02-today"] > .works-card { grid-template-columns:minmax(0,1fr); } .works-card__panel--ambientazione { border-top:1px solid var(--color-line); border-left:0; } .works-card__panel { padding:clamp(1.25rem,6vw,2.5rem); } }

/* OPERA · TODAY rework — each supplied template is a full visual module. */
[data-opera-section="02-today"] { width:100%; max-width:none; padding-inline:0; }
[data-opera-section="02-today"] > h2 { width:min(100%,var(--wide-width)); margin-inline:auto; padding-inline:var(--page-gutter); }
[data-opera-section="02-today"] > .works-card--stacked { width:min(calc(100% - (2 * var(--page-gutter))),88rem); max-width:88rem; margin:clamp(4rem,8vw,8rem) auto 0; display:block; border:0; }
[data-opera-section="03-archive"] { width:100%; max-width:none; padding-inline:0; }
[data-opera-section="03-archive"] > h2 { width:min(100%,var(--wide-width)); margin-inline:auto; padding-inline:var(--page-gutter); }
[data-opera-section="03-archive"] > .works-card--stacked { width:min(calc(100% - (2 * var(--page-gutter))),88rem); max-width:88rem; margin:clamp(4rem,8vw,8rem) auto 0; display:block; border:0; }
[data-opera-section="03-archive"] .works-card--archive .works-card__content { color:#171717 !important; }
.works-card--stacked .works-card__panel { position:relative; display:grid; grid-template-columns:minmax(0,1fr); align-items:start; min-height:0; margin:0; padding:0; overflow:visible; isolation:isolate; border:0; background:#111922; }
.works-card--stacked .works-card__panel--opera { background:#aaa397; }
.works-card--archive .works-card__panel { background:#edf0ee; }
.works-card--stacked .works-card__panel + .works-card__panel { border-top:1px solid var(--color-line); }
.works-card--stacked .works-card__visual { grid-area:1 / 1; position:relative; inset:auto; width:100%; height:auto; margin:0; z-index:0; }
.works-card--stacked .works-card__visual picture,.works-card--stacked .works-card__visual img { display:block; width:100%; height:auto; }
.works-card--stacked .works-card__visual img { object-fit:contain; object-position:center; }
.works-card--stacked .works-card__content { --works-inset:clamp(1.25rem,4vw,4.5rem); grid-area:1 / 1; position:relative; inset:auto; width:calc(52% - var(--works-inset)); min-width:0; max-width:38rem; margin:var(--works-inset) 0 var(--works-inset) var(--works-inset); justify-self:start; align-self:start; overflow:visible; color:#f2f0e9; text-align:left; text-wrap:pretty; z-index:1; }
.works-card--stacked .works-card__panel--opera .works-card__content { color:#171717; }
/* The supplied templates alternate their intentionally empty information field.
   These four canvases place the artwork / render on the left and reserve the right. */
:is([data-works-card="a-new-beginning"],[data-works-card="le-printemps-de-l-homme"],[data-works-card="the-dragons-might"],[data-works-card="at-the-mirror"]) .works-card__content {
  justify-self:end;
  margin-inline:0 var(--works-inset);
}
[data-opera-section="03-archive"] [data-text-side="right"] .works-card__content { justify-self:end; margin-inline:0 var(--works-inset); }
[data-opera-section="03-archive"] [data-text-side="left"] .works-card__content { justify-self:start; margin-inline:var(--works-inset) 0; }
.works-card--stacked .works-card__label { margin-bottom:clamp(1rem,2vw,2rem); color:inherit; font-size:clamp(.58rem,.75vw,.75rem); }
.works-card--stacked h3 { max-width:14ch; margin-bottom:.65rem; color:inherit; font-size:clamp(2rem,4.2vw,5.5rem); }
.works-card--stacked .works-card__subline { max-width:24ch; margin-bottom:clamp(1rem,2.4vw,2.5rem); color:inherit; font-size:clamp(1rem,1.7vw,1.75rem); }
.works-card--stacked .works-card__content p { max-width:50ch; margin-bottom:.9rem; color:inherit; font-size:clamp(.78rem,1.05vw,1.08rem); line-height:1.42; text-align:left; text-wrap:pretty; }
.works-card--stacked .works-card__content h4 { margin:clamp(1.1rem,2vw,2rem) 0 .5rem; color:inherit; font-size:clamp(.58rem,.72vw,.72rem); }

/* === SUMMARY OFFSET SYSTEM ===
   La posizione è gestita via transform: non influisce sul layout,
   quindi il testo resta SEMPRE su una riga (white-space: nowrap).
   Cambia --summary-offset per spostare la summary a destra (positivo)
   o a sinistra (negativo). */

.works-card--stacked .works-card__details {
  --summary-offset: 0px;             /* default: nessuno spostamento */
  max-width: 38ch;
  margin-top: clamp(1.5rem,2.5vw,2.8rem);
  border-top: 1px solid rgba(242,240,233,.55);
  color: inherit;
  overflow: visible;                 /* permette al testo di uscire senza tagliarsi */
}

.works-card--stacked .works-card__details summary {
  display: inline-flex;              /* tiene testo e "+" sulla stessa riga */
  align-items: center;
  gap: .6rem;
  padding: 1rem 0;
  cursor: pointer;
  font-size: clamp(.58rem,.72vw,.72rem);
  font-weight: 650;
  letter-spacing: .14em;
  list-style: none;
  white-space: nowrap;               /* <-- impedisce il wrapping su 2 righe */
  transform: translateX(var(--summary-offset));   /* <-- sposta senza rompere il layout */
  transition: transform 180ms var(--ease);
}

.works-card--stacked .works-card__details summary::-webkit-details-marker { display:none; }

.works-card--stacked .works-card__details summary::after {
  content: '+';
  font-size: 1rem;
  line-height: 1;
  float: none;                       /* niente più float, sta inline dopo il testo */
}

.works-card--stacked .works-card__details[open] summary::after { content: '−'; }

/* === PER-CARD SUMMARY OFFSETS ===
   Modifica solo il valore numerico di ogni card qui sotto.
   (Lascia 0px se vuoi che quella card resti allineata a sinistra.) */
[data-works-card="the-man-who-strives-the-sky"] .works-card__details { --summary-offset: -300px; }
[data-works-card="a-new-beginning"]              .works-card__details { --summary-offset: 300px; }
[data-works-card="le-printemps-de-l-homme"]      .works-card__details { --summary-offset: 300px; }
[data-works-card="the-dragons-might"]            .works-card__details { --summary-offset: 300px; }
[data-works-card="at-the-mirror"]                .works-card__details { --summary-offset: 300px; }

/* Card dell'archivio (usa data-text-side invece del nome card) */
[data-opera-section="03-archive"] [data-text-side="right"] .works-card__details { --summary-offset: 300px; }
[data-opera-section="03-archive"] [data-text-side="left"]  .works-card__details { --summary-offset: 0px;   }

/* TODAY structural calibration — approved test module only.
   The supplied Page 1 / Page 2 templates stay whole: the image establishes
   the panel's intrinsic canvas, while copy occupies its built-in right field. */
[data-opera-section="02-today"] > [data-works-card="the-man-who-strives-the-sky"] {
  width:min(calc(100% - (2 * var(--page-gutter))),88rem);
  max-width:88rem;
  margin:clamp(4rem,8vw,8rem) auto 0;
}
[data-works-card="the-man-who-strives-the-sky"] .works-card__panel {
  min-height:0;
  overflow:visible;
}
[data-works-card="the-man-who-strives-the-sky"] .works-card__visual {
  position:relative;
  inset:auto;
  width:100%;
  height:auto;
  z-index:0;
}
[data-works-card="the-man-who-strives-the-sky"] .works-card__visual picture,
[data-works-card="the-man-who-strives-the-sky"] .works-card__visual img {
  display:block;
  width:100%;
  height:auto;
}
[data-works-card="the-man-who-strives-the-sky"] .works-card__visual img {
  object-fit:contain;
  object-position:center;
}
[data-works-card="the-man-who-strives-the-sky"] .works-card__content {
  max-width:none;
  overflow:visible;
}
[data-works-card="the-man-who-strives-the-sky"] .works-card__content p,
[data-works-card="the-man-who-strives-the-sky"] .works-card__details { max-width:34ch; }
[data-works-card="the-man-who-strives-the-sky"] .works-card__panel--opera .works-card__content { color:#171717; }

@media (max-width:60rem) {
  .works-card--stacked .works-card__panel .works-card__content,
  [data-opera-section="03-archive"] [data-text-side] .works-card__content {
    grid-area:2 / 1;
    width:min(100%,48rem);
    max-width:none;
    margin:0 auto;
    padding:clamp(1.4rem,5vw,3rem);
    justify-self:center;
  }
  .works-card--stacked h3 { font-size:clamp(2rem,5vw,3.3rem); }
  .works-card--stacked .works-card__subline { font-size:clamp(1.15rem,3vw,1.7rem); line-height:1.2; }
  .works-card--stacked .works-card__content p { font-size:clamp(.95rem,2vw,1.08rem); line-height:1.5; }
  .works-card--stacked .works-card__content h4,
  .works-card--stacked .works-card__label,
  .works-card--stacked .works-card__details summary { font-size:.72rem; }

  /* Reset su mobile: tutte le summary tornano allineate a sinistra */
  .works-card--stacked .works-card__details { --summary-offset: 0px !important; }
}