/* Journal article surfaces share the palette of the main site. */
.editorial-page {
  background: #fff;
  color: var(--home-ink);
}

.editorial-page .editorial-header {
  padding: clamp(24px, 4.5vw, 63px) 0 clamp(30px, 5.1vw, 72px);
  border: 0;
  border-radius: 0 0 50% 5% / 0 0 7% 5%;
  background:
    radial-gradient(ellipse at 100% 0%, #d7eef1 0%, transparent 68%),
    linear-gradient(108deg, #f9fcfc, var(--home-pale));
}

.editorial-page .editorial-breadcrumbs {
  margin-bottom: clamp(23px, 3.3vw, 45px);
  color: var(--home-muted);
  font-size: 13px;
}

.editorial-page :is(.editorial-breadcrumbs a, .editorial-sidebar a):hover {
  color: var(--home-teal);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.editorial-page .editorial-label {
  gap: 9px;
  color: var(--home-teal);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.editorial-page .editorial-label > svg {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  padding: 4px;
  border-radius: 7px;
  background: #d9edf0;
  color: var(--home-teal);
}

.editorial-page .editorial-label > span:last-child {
  border-color: var(--home-border);
  color: var(--home-muted);
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

.editorial-page h1 {
  max-width: min(24ch, 100%);
  margin-bottom: clamp(15px, 2vw, 22px);
  color: var(--home-ink);
  font-size: clamp(38px, 5.4vw, 76px);
  font-weight: 730;
  line-height: 1.04;
  letter-spacing: -.048em;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.editorial-page .editorial-deck {
  max-width: 68ch;
  color: var(--home-muted);
  font-size: clamp(17px, 1.55vw, 21px);
  line-height: 1.65;
}

.editorial-page .editorial-meta {
  margin: clamp(24px, 3.2vw, 40px) 0 0;
  padding: clamp(15px, 2vw, 23px);
  border: 1px solid var(--home-border);
  border-radius: 14px;
  background: #ffffffcf;
}

.editorial-page :is(.editorial-date, .editorial-reading) {
  border-color: var(--home-border);
}

.editorial-page :is(.editorial-publisher small, .editorial-date > span, .editorial-reading > span, .editorial-share > span:first-child) {
  color: var(--home-muted);
}

.editorial-page :is(.editorial-publisher strong, .editorial-date time, .editorial-reading strong) {
  color: var(--home-ink);
}

.editorial-page .editorial-publisher:hover strong {
  color: var(--home-teal);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.editorial-page .editorial-share :is(a, button) {
  width: 36px;
  height: 36px;
  border-color: var(--home-border);
  border-radius: 9px;
  background: #fff;
  color: var(--home-teal);
}

.editorial-page .editorial-share :is(a, button):hover {
  border-color: #8db9bf;
  background: var(--home-pale);
}

.editorial-page #article-copy-status {
  color: var(--home-teal);
}

.editorial-page .editorial-sidebar {
  padding-right: 0;
  scrollbar-color: #adc7cc transparent;
}

.editorial-page .editorial-sidebar nav {
  padding: 20px;
  border: 1px solid var(--home-border);
  border-radius: 14px;
  background: var(--home-pale);
}

.editorial-page .editorial-sidebar h2 {
  margin-bottom: 14px;
  color: var(--home-ink);
}

.editorial-page .editorial-sidebar li > a {
  padding: 2px 0 2px 11px;
  border-color: var(--home-border);
  color: var(--home-muted);
}

.editorial-page .editorial-sidebar li > a:hover {
  border-color: var(--home-teal);
}

.editorial-page .editorial-sidebar li:last-child {
  margin-bottom: 0;
}

.editorial-page .editorial-sidebar-help {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid var(--home-border);
  border-radius: 14px;
}

.editorial-page .editorial-sidebar-help > svg,
.editorial-page .editorial-sidebar-help > a {
  color: var(--home-teal);
}

.editorial-page :is(.editorial-body p, .editorial-body li, .editorial-sidebar-help p) {
  color: var(--home-muted);
}

.editorial-page .editorial-body :is(h2, h3, .editorial-lead) {
  color: var(--home-ink);
}

.editorial-page .editorial-body h2 {
  font-weight: 750;
  letter-spacing: -.023em;
}

.editorial-page .editorial-body a {
  color: var(--home-teal);
  text-decoration-color: #86aeb4;
}

.editorial-page .editorial-body a:hover {
  text-decoration-color: currentColor;
}

.editorial-page :is(.editorial-takeaway, .editorial-about, .editorial-video) {
  border: 1px solid var(--home-border);
  border-radius: 14px;
  background: var(--home-pale);
}

.editorial-page .editorial-takeaway {
  border-inline-start: 4px solid var(--home-teal);
}

.editorial-page :is(.editorial-figure, .editorial-table-wrap) {
  border-color: var(--home-border);
  border-radius: 14px;
  background: #fff;
}

.editorial-page .editorial-figure figcaption {
  border-color: var(--home-border);
  background: var(--home-pale);
  color: var(--home-muted);
}

.editorial-page .editorial-body caption {
  background: var(--home-pale);
  color: var(--home-ink);
}

.editorial-page .editorial-body :is(td, th) {
  border-color: var(--home-border);
  color: var(--home-muted);
}

.editorial-page .editorial-body :is(th, td:first-child) {
  color: var(--home-ink);
}

.editorial-page .editorial-body .editorial-sources {
  border-color: var(--home-border);
}

.editorial-page .editorial-body .video-credit {
  color: var(--home-muted);
}

.editorial-page .video-stage {
  background: linear-gradient(140deg, var(--home-deep), var(--home-teal));
}

.editorial-page .editorial-body .video-stage p {
  color: #e6f4f6;
}

.editorial-page .video-actions button {
  border-color: var(--home-teal);
  border-radius: 999px;
  background: var(--home-teal);
}

.editorial-page .video-actions button:hover {
  background: var(--home-deep);
}

.editorial-page .editorial-related {
  padding-block: clamp(39px, 6vw, 82px);
  border-color: var(--home-border);
  background: var(--home-pale);
}

.editorial-page :is(.editorial-kicker, .editorial-related-grid strong, .editorial-related-grid > a > div > span) {
  color: var(--home-teal);
}

.editorial-page .editorial-related h2 {
  color: var(--home-ink);
  font-weight: 750;
}

.editorial-page .editorial-related-grid > a {
  border-color: var(--home-border);
  border-radius: 16px;
  color: var(--home-ink);
  box-shadow: 0 6px 17px #1645500b;
}

.editorial-page .editorial-related-grid > a:hover {
  border-color: #8db9bf;
}

.editorial-page .editorial-related-grid > a:hover strong {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.editorial-page .editorial-cta {
  background: linear-gradient(112deg, var(--home-deep), var(--home-teal));
  color: #fff;
}

.editorial-page .editorial-cta p {
  color: #d5edf2;
}

.editorial-page .editorial-cta .button {
  border-color: #fff;
  border-radius: 999px;
  background: #fff;
  color: var(--home-deep);
}

.editorial-page .editorial-cta .button:hover {
  border-color: #d8eef1;
  background: #d8eef1;
}

.editorial-page :is(a, button):focus-visible {
  outline: 2px solid var(--home-teal);
  outline-offset: 4px;
}

.editorial-page .editorial-cta .button:focus-visible {
  outline-color: #fff;
}

@media (max-width: 600px) {
  .editorial-page .editorial-label {
    letter-spacing: .04em;
  }

  .editorial-page .editorial-meta {
    row-gap: 15px;
  }

  .editorial-page .editorial-share {
    flex-wrap: wrap;
    gap: 8px 12px;
  }
}