/* PR-06A: isolated editorial surfaces. Depends on tb-design-system.css. */
.tb-editorial {
  color: var(--tb-ink);
  background: var(--tb-canvas);
}

.tb-editorial > .tb-breadcrumbs {
  max-width: 80rem;
  margin-inline: auto;
  padding: 1rem clamp(1rem, 4vw, 2rem);
}

.tb-editorial__hero {
  isolation: isolate;
  min-height: clamp(17rem, 34vw, 28rem);
  display: grid;
  align-items: center;
}

.tb-editorial__hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(135deg, rgba(47, 29, 59, 0.92), rgba(117, 69, 161, 0.72));
}

.tb-editorial__hero > .absolute {
  display: none;
}

.tb-editorial__hero h1 {
  max-width: 18ch;
  margin-inline: auto;
  color: var(--tb-surface);
  text-wrap: balance;
}

.tb-editorial__hero p {
  color: var(--tb-lavender);
}

.tb-editorial main,
.tb-editorial--article > div:not(.tb-editorial__hero) {
  width: min(100% - 2rem, 80rem);
}

.tb-editorial article,
.tb-editorial main > section,
.tb-editorial--player main > div {
  border-color: var(--tb-border);
}

.tb-editorial article.bg-white,
.tb-editorial .bg-white,
.tb-editorial--player main > div {
  border: 1px solid var(--tb-border);
  border-radius: var(--tb-radius-md);
  box-shadow: var(--tb-shadow-subtle);
}

.tb-editorial a:focus-visible,
.tb-editorial audio:focus-visible {
  outline: 3px solid var(--tb-gold);
  outline-offset: 3px;
}

.tb-editorial .prose {
  max-width: 72ch;
  margin-inline: auto;
  color: var(--tb-ink);
  font-size: 1.0625rem;
  line-height: 1.8;
}

.tb-editorial .prose h2,
.tb-editorial h2,
.tb-editorial h3,
.tb-editorial h4 {
  color: var(--tb-plum);
}

.tb-editorial .prose a,
.tb-editorial--article ol a {
  color: var(--tb-purple);
  text-decoration-thickness: 0.1em;
  text-underline-offset: 0.18em;
}

.tb-editorial--article ol {
  line-height: 1.65;
}

.tb-editorial--player audio {
  min-height: 3.5rem;
  accent-color: var(--tb-purple);
}

@media (max-width: 47.99rem) {
  .tb-editorial__hero {
    min-height: 15rem;
  }

  .tb-editorial .prose {
    font-size: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tb-editorial *,
  .tb-editorial *::before,
  .tb-editorial *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}