.aboutintro04 { padding: var(--section-y) 0; background: var(--color-bg); }

.aboutintro04__inner {
  max-width: var(--content-max);
  margin-inline: auto;
  padding-inline: var(--page-pad);
}

.aboutintro04__eyebrow {
  margin: 0 0 var(--space-5);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #596779;
}
.aboutintro04__grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: var(--space-6);
  margin-top: var(--space-5);
}
.aboutintro04__title {
  font-size: 3.625rem;
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 1.04;
}
.aboutintro04__lead { font-size: 1.1875rem; line-height: 1.6; color: #4e5b6c; }
.aboutintro04__copy { margin-top: var(--space-4); color: #4e5b6c; }
.aboutintro04__roles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
  margin-top: var(--space-6);
}
.aboutintro04__roles article {
  padding: var(--space-6);
  background: var(--color-surface);
  border-radius: var(--radius);
}
.aboutintro04__roles article:nth-child(2) {
  background: var(--color-brand);
  color: var(--color-brand-ink);
}
.aboutintro04__roles article:nth-child(2) .aboutintro04__eyebrow,
.aboutintro04__roles article:nth-child(2) p { color: #dbe2eb; }
.aboutintro04__roles h2 {
  font-size: 2rem;
  font-weight: 600;
  letter-spacing: -0.045em;
}
.aboutintro04__roles p { margin-top: var(--space-4); }
@media (max-width: 768px) {
  .aboutintro04__grid, .aboutintro04__roles { grid-template-columns: 1fr; }
  .aboutintro04__title { font-size: 2.625rem; }
}