/* Reading theme and cinematic openings. Theme aliases remain locally scoped. */

.redesign-copper {
  --new-ground: #ebdfcc;
  --new-ink: #282b25;
  --new-accent: #9e482f;
  --new-paper: #fff9ee;
  --new-paper-ink: #2e392d;
  --new-body: var(--font-blueprint-body);
  --new-display: var(--font-blueprint-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: -0.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 :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 .page-hero-compact .folio-art {
  box-shadow: 0 20px 55px var(--color-shadow-soft);
}

.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%, 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,
.redesign .footer.theme-dark {
  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 .cinematic-hero {
  --scene: 0;
  background: var(--new-ground);
  color: var(--new-ink);
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding-block: clamp(2.5rem, 5vw, 5.8rem);
}

.redesign .cinematic-hero .cinematic-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  align-items: center;
  min-height: min(650px, 72svh);
  gap: clamp(1.2rem, 4.5vw, 5rem);
}

.redesign .cinematic-hero :is(.hero-text, .cinema__copy) {
  position: relative;
  min-width: 0;
  z-index: 2;
  order: unset;
  container-type: inline-size;
}

.redesign .cinematic-hero :is(h1, #cinema-title) {
  color: inherit;
  letter-spacing: -0.055em;
  line-height: 0.99;
  max-width: none;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  font-size: min(clamp(2.45rem, 5.8vw, 6.2rem), 13cqi);
}

.redesign .cinematic-hero :is(.hero-deck, .cinema__copy > p:not(.cinema__eyebrow)) {
  color: inherit;
  font-size: clamp(1rem, 1.5vw, 1.3rem);
  max-width: 42ch;
  margin-top: 1.4rem;
}

.redesign .cinematic-hero :is(.eyebrow, .cinema__eyebrow) {
  color: var(--new-accent);
  font-family: var(--new-body);
  font-weight: var(--font-weight-strong);
  margin-bottom: var(--space-text);
}

.redesign .cinematic-hero :is(.button-quiet, .cinema__link) {
  color: inherit;
  border-color: currentColor;
}

.redesign .cinematic-art {
  position: relative;
  min-width: 0;
  isolation: isolate;
  overflow: hidden;
  margin: 0;
  aspect-ratio: 1.38;
  background: #24342f;
  box-shadow: 0 32px 60px var(--color-shadow-soft);
  border: 1px solid color-mix(in srgb, var(--new-accent) 65%, transparent);
}

.redesign .cinematic-art svg {
  width: 100%;
  height: 100%;
  display: block;
}

.redesign .cinematic-art figcaption {
  position: absolute;
  inset: auto auto 0.8rem 0.8rem;
  padding: 0.4rem 0.65rem;
  color: var(--color-white);
  background: #151e2deb;
  font-family: var(--new-body);
  font-size: 0.72rem;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

.art-far,
.art-subject,
.art-near {
  transform-box: view-box;
  transform-origin: center;
}

.art-far {
  transform: translateY(calc(var(--scene) * -10px)) scale(1.035);
}

.art-subject {
  transform: translateY(calc(var(--scene) * -33px)) scale(calc(1 + var(--scene) * 0.035));
}

.art-near {
  transform: translateY(calc(var(--scene) * -65px));
}

.redesign .cinematic-hero .hero-buttons {
  flex-wrap: wrap;
}

.redesign-copper .cinematic-art {
  border: 10px solid #f7ebd4;
  transform: rotate(-3deg);
}

.redesign-ledger .cinematic-art {
  border-block: 6px double var(--new-accent);
}

.redesign-plum .cinematic-art {
  border-radius: 52% 45% 10px 10px / 12% 12% 10px 10px;
}

.redesign-paper .cinematic-art {
  border: 10px solid #fffaec;
  box-shadow: 16px 16px 0 var(--color-copper-shadow);
}

.redesign-atlas .cinematic-art {
  border-radius: 0 65px 0 0;
}

.redesign-sage .cinematic-art {
  border-radius: 48% 52% 40% 35% / 38% 45% 50% 35%;
}

.redesign-flight .cinematic-art {
  border: 3px double var(--new-accent);
}

.redesign-terracotta .cinematic-art {
  border-radius: 48% 48% 0 0 / 26% 26% 0 0;
}

.redesign-indigo .cinematic-art {
  border: 0;
  clip-path: polygon(0 0, 91% 0, 100% 13%, 100% 100%, 9% 100%, 0 87%);
}

.redesign-paper :is(.section h2, .resource-card h3) {
  font-weight: 550;
}

.redesign-flight .resource-grid {
  grid-template-columns: 1fr;
}

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

.redesign-plum main > .section:nth-of-type(even) {
  background: #f6e1e1;
}

.redesign-atlas .resource-card {
  border-radius: 0 28px 0 0;
}

.redesign-sage .resource-card {
  border-radius: var(--radius-scene);
}

.redesign-terracotta .resource-card {
  border-radius: 42px 42px 0 0;
}

.redesign-indigo .resource-card {
  border-inline-start: 5px double #7e64b3;
}

@media (min-width: 1000px) {
  .redesign :is(.cinematic-reverse, .cinematic-portal) .cinematic-art {
    grid-column: 1;
    grid-row: 1;
  }
  .redesign :is(.cinematic-reverse, .cinematic-portal) .hero-text {
    grid-column: 2;
    grid-row: 1;
  }
  .redesign .cinematic-reverse .cinematic-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  }
  .redesign .cinematic-portal .cinematic-grid {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  }
  .redesign .cinematic-map .cinematic-grid {
    grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
  }
  .redesign .cinematic-magazine .cinematic-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  }
  .redesign .cinematic-soft .cinematic-grid {
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  }
  .redesign :is(.cinematic-wide, .cinematic-center) .cinematic-grid {
    grid-template-columns: 1fr;
    gap: 2.4rem;
  }
  .redesign :is(.cinematic-wide, .cinematic-center) .cinematic-art {
    aspect-ratio: 2.55;
  }
  .redesign .cinematic-wide h1 {
    max-width: 17ch;
  }
  .redesign .cinematic-center .hero-text {
    text-align: center;
  }
  .redesign .cinematic-center :is(h1, .hero-deck) {
    margin-inline: auto;
    max-width: 20ch;
  }
  .redesign .cinematic-center .hero-deck {
    max-width: 48ch;
  }
  .redesign .cinematic-center .hero-buttons {
    justify-content: center;
  }
  .redesign .cinematic-strip .cinematic-grid {
    grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
  }
  .redesign .cinematic-strip .cinematic-art {
    aspect-ratio: 1.75;
  }
  .redesign .cinematic-stack .cinematic-art {
    aspect-ratio: 1.13;
  }
}

@media (max-width: 760px) {
  .redesign .cinematic-hero .cinematic-grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .redesign .cinematic-art {
    aspect-ratio: 1.55;
  }
  .redesign .cinematic-portal .cinematic-art,
  .redesign .cinematic-stack .cinematic-art {
    aspect-ratio: 1.25;
  }
  .redesign-copper .cinematic-art {
    transform: none;
    border-width: 5px;
  }
  .redesign-paper .cinematic-art {
    border-width: 5px;
    box-shadow: 7px 7px 0 var(--color-copper-shadow);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cinematic-hero :is(.art-far, .art-subject, .art-near) {
    transform: none;
  }
}

/* Keep legacy action classes readable on the new hero grounds. */

.redesign .cinematic-hero :is(.button-primary, .button--primary) {
  background: var(--color-brand-primary);
  border-color: var(--color-brand-primary);
  color: var(--color-white);
}

.redesign .cinematic-hero :is(.button-primary, .button--primary):hover {
  background: var(--color-brand-primary-hover);
  border-color: var(--color-brand-primary-hover);
  color: var(--color-white);
}

.redesign .cinematic-hero .button-quiet {
  background: transparent;
  color: var(--new-ink);
  border-color: currentColor;
}

.redesign .cinematic-hero .button-quiet:hover {
  color: var(--new-ground);
  background: var(--new-ink);
}

.redesign .site-header .wordmark em {
  color: var(--new-accent);
}

.redesign .site-header .button--top {
  background: var(--color-brand-primary);
  color: var(--color-white);
}

.redesign .site-header .mobile-menu-button :is(span, svg) {
  color: var(--new-ink);
}

.redesign .cinematic-magazine h1 {
  max-width: 15ch;
}

/* Size display text against its copy column, including narrow desktop splits. */

@media (max-width: 760px) {
  .redesign .cinematic-hero :is(h1, #cinema-title) {
    font-size: min(clamp(2.25rem, 9.4vw, 4.2rem), 12.6cqi);
  }
}

/* Shared menu control: maintain readable glyphs across light and dark themes. */

.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);
}

.redesign .site-header .mobile-menu-button svg {
  color: var(--new-paper-ink);
}