/* Editorial theme: typography, navigation, cards, and reading surfaces.
 * Keep the HTML stylesheet order: specificity and module order define the cascade.
 */

.redesign-ledger {
  --new-ground: var(--color-classic-ink);
  --new-ink: var(--color-opening-ink);
  --new-accent: #c6d1ff;
  --new-paper: #eaf0fa;
  --new-paper-ink: var(--color-classic-ink);
  --new-body: var(--font-editorial-body);
  --new-display: var(--font-editorial-display);
}

.redesign {
  --ink: var(--new-paper-ink);
  background: var(--new-paper);
  color: var(--new-paper-ink);
  font-family: var(--new-body);
}

.redesign :is(h1,h2,h3,h4) {
  font-family: var(--new-display);
  letter-spacing: -.035em;
  text-wrap: balance;
}

.redesign .site-header {
  background: var(--new-ground);
  color: var(--new-ink);
  border-bottom-color: color-mix(in srgb,var(--new-ink) 32%,transparent);
}

.redesign .site-header :is(.desktop-menu a,.desktop-nav a,.site-logo,.wordmark,.nav-link,.nav-toggle,.mobile-menu-button) {
  color: var(--new-ink);
}

.redesign .site-header .nav-toggle span {
  background: var(--new-ink);
}

.redesign .site-header :is(.mobile-menu,.mobile-nav) {
  background: var(--new-paper);
  color: var(--new-paper-ink);
}

.redesign .site-header :is(.mobile-menu,.mobile-nav) :is(a,.nav-link) {
  color: var(--new-paper-ink);
}

.redesign :focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 4px;
}

.redesign :is(.page-hero.page-hero-compact,.route-hero,.cinema) {
  background: var(--new-ground);
  color: var(--new-ink);
}

.redesign :is(.page-hero.page-hero-compact,.route-hero) :is(h1,.hero-deck,.eyebrow,.route-hero__copy p,.v5-hero-label) {
  color: inherit;
}

.redesign :is(.section-alt,.folio-acts,.manifesto-section,.simple-body-section,.source-content-section,.request-section) {
  background: var(--new-paper);
  color: var(--new-paper-ink);
}

.redesign :is(.bottom-cta,.cta-band) {
  background: var(--new-ground);
  color: var(--new-ink);
}

.redesign :is(.bottom-cta,.cta-band) :is(h2,p,.eyebrow,.eyebrow--cyan) {
  color: inherit;
}

.redesign :is(.form-wrap,.request-panel,.aside-service-box) {
  background: color-mix(in srgb,var(--new-paper) 70%,var(--color-white));
  color: var(--new-paper-ink);
}

.redesign :is(.resource-card,.article-section,.case-chapter) {
  border-color: color-mix(in srgb,var(--new-paper-ink) 24%,var(--new-paper));
}

.redesign .resource-card :is(h2,h3) {
  font-size: clamp(1.28rem,2vw,1.8rem);
  line-height: 1.16;
}

.redesign .article-layout :is(.article-toc nav a,.toc-links a) {
  flex-shrink: 0;
}

.redesign .article-layout :is(h2,h3) {
  line-height: 1.14;
}

.redesign .site-footer {
  background: var(--new-ground);
  color: var(--new-ink);
}

.redesign :is(.site-footer,.footer.theme-dark) :is(a,p,h3,span) {
  color: inherit;
}

.redesign :is(.site-footer,.footer.theme-dark) a:hover {
  text-decoration: underline;
}

.redesign-ledger .resource-card {
  border-bottom: 2px solid var(--new-accent);
}

@media (min-width: 1000px) {
  .redesign :is(.cinematic-reverse,.cinematic-portal) .hero-text {
    grid-column: 2;
    grid-row: 1;
  }
}

.redesign .site-header :is(.nav-toggle,.mobile-menu-button) {
  color: var(--new-paper-ink);
  background: var(--new-paper);
  border-color: var(--new-paper);
}

.redesign .site-header :is(.nav-toggle,.mobile-menu-button) span {
  background: var(--new-paper-ink);
}