/* Standard product, company, and learning introductions.
   Deliberately separate from the home, industry, and blog headers. */
.topic-hero {
  padding: 64px var(--gutter);
  background: var(--navy-surface);
  text-align: left;
}
.topic-hero::before { display: none; }
.topic-hero h1 {
  font-family: var(--font);
  font-size: clamp(2rem, 3.6vw, 3.25rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.04em;
  text-shadow: none;
  max-width: 900px;
  margin: 0 0 20px;
}
.topic-hero .breadcrumb { margin: 0 0 24px; font-size: .8125rem; }
.topic-hero .subhead,
.topic-hero[data-topic="ada"] .subhead { margin: 0; line-height: 1.7; }
.topic-hero.topic-hero-illustrated { padding: 64px var(--gutter); }
.topic-hero-illustrated .topic-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: center;
  gap: 48px;
}
.topic-hero-copy { min-width: 0; }
.topic-hero-actions, .topic-hero .audit-hero-actions {
  display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 0;
}
.topic-hero-media { min-width: 0; margin: 0; }
.topic-hero-media img {
  display: block; width: 100%; height: auto;
  border: 1px solid #637397; border-radius: 3px;
  box-shadow: 0 16px 40px rgb(0 0 0 / 18%);
}
.topic-hero-media figcaption {
  margin: 12px 0 0; color: #d7dfef; font-size: .8125rem; line-height: 1.6;
}
@media (max-width: 900px) {
  .topic-hero-illustrated .topic-hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .topic-hero-media { max-width: 640px; }
}
@media (max-width: 600px) {
  .topic-hero, .topic-hero.topic-hero-illustrated { padding: 36px var(--gutter); }
  .topic-hero h1 { font-size: 2rem; }
  .topic-hero .breadcrumb { margin-bottom: 20px; }
  .topic-hero .subhead { font-size: 1rem; }
}