/* Four original PNG illustrations, connected beneath the reading layer. */
body.design-combined #introLineStory .intro-line-layout {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: clamp(48px, 5vw, 68px);
}
#introLineStory .intro-beat {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(180px, 16vw, 210px);
  column-gap: clamp(24px, 2.5vw, 36px);
  align-items: center;
  min-width: 0;
}
#introLineStory .intro-beat:nth-of-type(even) {
  grid-template-columns: clamp(180px, 16vw, 210px) minmax(0, 1fr);
}
#introLineStory .intro-beat:nth-of-type(even) .intro-beat-copy { grid-column: 2; grid-row: 1; }
#introLineStory .intro-beat:nth-of-type(even) .intro-beat-art { grid-column: 1; grid-row: 1; }
#introLineStory .intro-beat-copy,
#introLineStory .intro-beat-art { position: relative; z-index: 1; min-width: 0; }
body.design-combined #aboutScroll #introLineStory .intro-beat-copy p { margin: 0; max-width: none; }
#introLineStory .intro-beat-art { width: 100%; margin: 0; pointer-events: none; overflow: hidden; }
#introLineStory .intro-beat-art img { position: absolute; display: block; width: var(--art-width); max-width: none; left: var(--art-left); top: var(--art-top); height: auto; user-select: none; }
#introLineStory .intro-thread {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: visible;
  pointer-events: none;
  opacity: .58;
}
body.design-combined #aboutScroll #introLineStory .intro-closing-note {
  margin: clamp(64px, 7vw, 88px) auto 12px;
  max-width: 40ch;
  padding: 0;
  border: 0;
  text-align: center;
  font-size: clamp(16px, 1.8vw, 24px);
  line-height: 1.4;
  letter-spacing: -.035em;
  color: #171b20;
  text-wrap: balance;
}
body.design-combined #aboutScroll #introLineStory .intro-closing-note strong {
  font-weight: 600;
  color: inherit;
}
body.about-language .portfolio-heading,
body.about-language .formation-header { transition: none; overflow-anchor: none; }

@media (max-width: 899px) {
  body.design-combined #introLineStory .intro-line-layout { gap: 48px; }
  #introLineStory .intro-beat,
  #introLineStory .intro-beat:nth-of-type(even) { grid-template-columns: minmax(0, 1fr); row-gap: 24px; padding-left: 28px; }
  #introLineStory .intro-beat .intro-beat-copy,
  #introLineStory .intro-beat:nth-of-type(even) .intro-beat-copy { grid-column: 1; grid-row: 1; }
  #introLineStory .intro-beat .intro-beat-art,
  #introLineStory .intro-beat:nth-of-type(even) .intro-beat-art { grid-column: 1; grid-row: 2; width: min(210px, 82%); justify-self: center; }
  #introLineStory .intro-thread { opacity: .4; }
}
@media (prefers-reduced-motion: reduce) {
  #introLineStory .intro-beat-art img { opacity: 1 !important; visibility: visible !important; transform: none !important; }
  #introLineStory .intro-thread-path { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
}

/* Frame out excess transparent canvas without changing the original PNG files. */
#introLineStory [data-intro-step="1"] .intro-beat-art { aspect-ratio: 801 / 740; --art-width: 156.5543%; --art-left: -29.4632%; --art-top: -37.5676%; }
#introLineStory [data-intro-step="2"] .intro-beat-art { aspect-ratio: 833 / 973; --art-width: 150.5402%; --art-left: -25.4502%; --art-top: -14.0802%; }
#introLineStory [data-intro-step="3"] .intro-beat-art { aspect-ratio: 982 / 633; --art-width: 127.6986%; --art-left: -16.8024%; --art-top: -52.6066%; }
#introLineStory [data-intro-step="4"] .intro-beat-art { aspect-ratio: 949 / 785; --art-width: 132.1391%; --art-left: -22.2339%; --art-top: -39.3631%; }

/* The title only precedes the copy; let the taller right-hand artwork stay visible. */
body.about-language .design-mode-stage .portfolio-heading { background: transparent; }

body.design-combined #aboutScroll #introLineStory .intro-closing-note strong { background:linear-gradient(transparent 63%,#a8dfff 63%,#a8dfff 94%,transparent 94%); box-decoration-break:clone; -webkit-box-decoration-break:clone; padding-inline:.12em; }