/* Programme typography: chapter headings beside a generous, continuous reading column. */
.integration-content {
  --reading-width: 44rem;
  --chapter-gap: clamp(2rem, 7vw, 8rem);
}
.integration-chapter {
  display: grid;
  grid-template-columns: minmax(13rem, .8fr) minmax(0, 1.7fr);
  align-items: start;
  gap: var(--chapter-gap);
  padding: clamp(3.5rem, 7vw, 7.5rem) var(--space);
  border-bottom: 1px solid var(--line);
}
.integration-chapter-header { min-width: 0; }
.integration-chapter-index {
  margin-bottom: 1.6rem;
  font-size: .8125rem;
  line-height: 1.5;
  font-weight: 600;
  letter-spacing: .09em;
  color: var(--muted);
}
.integration-chapter-header h2 {
  margin: 0;
  max-width: 15ch;
  font-size: clamp(2.25rem, 3.4vw, 3.65rem);
  line-height: 1.12;
  letter-spacing: -.045em;
  overflow-wrap: break-word;
  hyphens: auto;
  text-wrap: balance;
}
.integration-body {
  width: 100%;
  max-width: var(--reading-width);
  min-width: 0;
  padding-top: 2.8rem;
  font-size: 1.125rem;
  line-height: 1.8;
  letter-spacing: -.008em;
  overflow-wrap: break-word;
}
.integration-body p { margin: 0; }
.integration-body p + p { margin-top: 1.6rem; }
.integration-body .integration-lead {
  font-size: clamp(1.25rem, 1.7vw, 1.5rem);
  line-height: 1.6;
  letter-spacing: -.018em;
}
.integration-body strong { font-weight: 600; }
.integration-principles,
.integration-methods { margin-top: clamp(3.5rem, 6vw, 5.5rem); }
.integration-principle,
.integration-method {
  padding: clamp(2rem, 3vw, 3rem) 0;
  border-top: 1px solid var(--ink);
}
.integration-principle + .integration-principle,
.integration-method + .integration-method { margin-top: 1rem; }
.integration-body .integration-block-label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: .35em;
  margin: 0 0 1.5rem;
  color: var(--red);
  font-size: clamp(1.8rem, 3.2vw, 2.85rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -.045em;
}
.integration-block-label span { font-variant-numeric: tabular-nums; }
.integration-body h4 {
  margin: 0 0 1.2rem;
  font-size: clamp(1.5rem, 2.2vw, 2rem);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.integration-chapter--methode { background: #e7e7e1; }
.integration-didactic {
  margin-top: 3rem;
  padding: clamp(1.5rem, 3.5vw, 3rem);
  background: var(--ink);
  color: var(--paper);
  border-top: 4px solid var(--red);
}
.integration-body .integration-didactic-label {
  margin: 0 0 1.5rem;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .06em;
  color: #f79483;
}
.integration-didactic h4 {
  font-size: clamp(1.75rem, 2.8vw, 2.6rem);
  overflow-wrap: anywhere;
  hyphens: auto;
}
.integration-didactic p { font-size: 1.0625rem; line-height: 1.8; }
.integration-numbered {
  list-style: none;
  padding: 0;
  margin: 2.75rem 0;
}
.integration-numbered li {
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr);
  align-items: baseline;
  column-gap: 1.25rem;
  padding: 1.65rem 0;
  border-top: 1px solid var(--line);
}
.integration-numbered li:last-child { border-bottom: 1px solid var(--line); }
.integration-list-number {
  color: var(--red);
  font-size: 1.8rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  letter-spacing: -.045em;
}
.integration-numbered p { line-height: 1.65; }
.integration-body .integration-takeaway {
  margin-top: 2.75rem;
  padding-left: 1.5rem;
  border-left: 3px solid var(--red);
  font-size: 1.3rem;
  line-height: 1.6;
  letter-spacing: -.02em;
}
.integration-closing {
  display: block;
  background: var(--ink);
  color: var(--paper);
  padding-top: clamp(4rem, 8vw, 8rem);
  padding-bottom: clamp(4rem, 8vw, 8rem);
  border-bottom: 0;
}
.integration-closing .integration-chapter-index { color: #bcbcb3; margin-bottom: 3rem; }
.integration-quote { margin: 0; max-width: 74rem; }
.integration-quote h2 {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(2.1rem, 4.8vw, 4.9rem);
  font-weight: 400;
  line-height: 1.23;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.integration-closing-body {
  padding-top: 0;
  margin-top: clamp(2.75rem, 5vw, 5rem);
  margin-left: auto;
  color: #deded6;
}
.integration-return {
  display: inline-block;
  margin-top: 2rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid #85857e;
  color: var(--paper);
  font-size: 1rem;
  line-height: 1.5;
}
.integration-return:hover { color: #f79483; border-color: currentColor; }
@media (min-width: 1700px) {
  .integration-chapter { grid-template-columns: minmax(17rem, .8fr) minmax(0, 1.7fr); }
}
@media (max-width: 1000px) {
  .integration-chapter { grid-template-columns: minmax(11rem, .7fr) minmax(0, 1.5fr); gap: 2rem; }
  .integration-chapter-header h2 { font-size: 2.3rem; }
  .integration-body { font-size: 1.0625rem; }
}
@media (max-width: 760px) {
  .integration-chapter { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .integration-chapter-index { margin-bottom: 1rem; font-size: .75rem; }
  .integration-chapter-header h2 { max-width: 18ch; font-size: clamp(2.1rem, 8vw, 3rem); }
  .integration-body { max-width: none; font-size: 1.0625rem; line-height: 1.75; padding-top: 0; }
  .integration-body .integration-lead { font-size: 1.22rem; line-height: 1.6; }
  .integration-principles, .integration-methods { margin-top: 3rem; }
  .integration-principle, .integration-method { padding-top: 1.75rem; padding-bottom: 1.75rem; }
  .integration-body .integration-block-label { font-size: clamp(1.7rem, 7.5vw, 2.3rem); margin-bottom: 1.1rem; }
  .integration-body h4 { font-size: 1.5rem; line-height: 1.3; }
  .integration-didactic { margin-top: 1.75rem; padding: 1.5rem; }
  .integration-didactic h4 { font-size: 1.8rem; }
  .integration-numbered { margin: 2rem 0; }
  .integration-numbered li { grid-template-columns: 2rem minmax(0, 1fr); column-gap: .9rem; padding: 1.3rem 0; }
  .integration-list-number { font-size: 1.5rem; }
  .integration-body .integration-takeaway { font-size: 1.2rem; margin-top: 2rem; padding-left: 1rem; }
  .integration-closing .integration-chapter-index { margin-bottom: 2rem; }
  .integration-quote h2 { font-size: clamp(2rem, 7.4vw, 3rem); line-height: 1.25; }
  .integration-closing-body { margin-top: 2.5rem; }
}
