/* Shared case title, chapter, narrative and caption roles. */
:root {
  --jt-case-title-size: 46px;
  --jt-case-title-leading: 52px;
  --jt-case-chapter-size: 28px;
  --jt-case-chapter-leading: 34px;
  --jt-case-reading-size: 16px;
  --jt-case-reading-leading: 26px;
  --jt-case-chapter-space: 64px;
  --jt-case-metadata-size: 9px;
  --jt-case-metadata-leading: 14px;
  --jt-case-subtitle-size: 19px;
  --jt-case-subtitle-leading: 28px;
  --jt-case-group-size: 20px;
  --jt-case-group-leading: 26px;
  --jt-case-callout-size: 22px;
  --jt-case-callout-leading: 30px;
}
@media (max-width: 600px) {
  :root {
    --jt-case-title-size: 32px;
    --jt-case-title-leading: 36px;
    --jt-case-chapter-size: 24px;
    --jt-case-chapter-leading: 30px;
    --jt-case-reading-size: 15px;
    --jt-case-reading-leading: 24px;
    --jt-case-chapter-space: 40px;
    --jt-case-subtitle-size: 17px;
    --jt-case-subtitle-leading: 25px;
    --jt-case-callout-size: 20px;
    --jt-case-callout-leading: 28px;
  }
}

/* All forty canonical case / employer titles. */
:root main[data-portfolio-route] :is(
  .case-masthead__title, .leadership-masthead > h1,
  .employer-story__heading > h1, .masthead > h1,
  .rocket-masthead > h1, .intro > h1, .farm-intro > h1
) {
  font-family: Arimo, Arial, sans-serif;
  font-size: var(--jt-case-title-size);
  font-weight: 700;
  line-height: var(--jt-case-title-leading);
  letter-spacing: -.03em;
}

/* Chapter role only. Novant uses h3 for its nested chapter headings.
   The separate Novant part headings retain their hierarchy. */
:root main[data-portfolio-route] :is(
  .chapter > h2, .chapter .text h2, .chapter-story > h2,
  .batch-case__section > header > h2,
  .employer-story__chapter-heading > h2,
  .employer-story__disciplines > h2, .employer-story__selected > h2,
  .rocket-auto__section-heading > h2, .rocket-system__section-heading > h2,
  .novant__section-heading > h3,
  .narrative-case__section-inner > h2,
  .captain-case__section > h2, .olive-case__section > h2,
  .eggo-case__section > h2, .rocket-section > .rocket-reading > h2
  , .cummins-product-case__section > h2
),
:root :is(.financial-case--aaa, .financial-case__content--dfcu,
  .financial-case__content--farmington) section:not(.intro):not(.farm-intro) h2,
:root main[data-portfolio-route="/janus-capital-digital-experience-content-strategy"]
  > section:not(.intro) h2 {
  font-family: Arimo, Arial, sans-serif;
  font-size: var(--jt-case-chapter-size);
  font-weight: 700;
  line-height: var(--jt-case-chapter-leading);
  letter-spacing: -.02em;
}

/* Explicit narrative roles. Reading-family distinctions remain established;
   metric normalization applies to regular body paragraphs and lists. */
:root main[data-portfolio-route] :is(
  .case-masthead__introduction, .leadership-masthead__introduction,
  .employer-story__intro, .employer-story__copy,
  .batch-case__copy, .rocket-auto__copy, .rocket-system__copy, .novant__copy,
  .intro, .chapter-copy, .chapter .copy, .rocket-reading, .cummins-product-case__copy,
  .olive-case__introduction, .olive-case__reading,
  .eggo-case__introduction, .eggo-case__reading,
  .simple-bounded-narrative, .simple-bounded-pre-media,
  .dense-editorial__narrative, .paired-evidence__narrative,
  .video-rich__narrative
) > :is(p, ul, ol):not(.eyebrow):not(.kicker):not(.role):not(.role-line):not(.metadata):not(.title-qualifier):not(.strapline):not(.subline),
:root main[data-portfolio-route] :is(
  .leadership-editorial__copy, .leadership-editorial__run-in,
  p.case-masthead__introduction
),
:root .narrative-case__copy:not(.narrative-case__copy--split)
  > p:not([data-copy-emphasis="primary"]),
:root :is(.captain-case__section > p, .captain-case__introduction > p,
  .olive-case__reading > p, .eggo-case__reading > p),
:root :is(.financial-case--aaa, .financial-case__content--dfcu,
  .financial-case__content--farmington,
  main[data-portfolio-route="/janus-capital-digital-experience-content-strategy"])
  :is(.body-copy > p, .intro-copy > p, .copy-cols p,
      .feature-copy > p:not(.eyebrow), .delivery p:not(.eyebrow),
      .ending > p:not(.eyebrow), .build-copy > p:not(.eyebrow):not(.caption),
      .section-deck, .build-copy > ol, .contribution-grid p,
      .response-section > p:not(.eyebrow)) {
  font-size: var(--jt-case-reading-size);
  font-weight: 400;
  line-height: var(--jt-case-reading-leading);
}

/* Visible figure captions. Dialogs, buttons, credit labels, and card headings
   retain their component styles and interaction sizing. */
:root main[data-portfolio-route] :is(
  .visual > figcaption, .employer-story__artifact > figcaption,
  .batch-case__artifact > figcaption, .batch-case__caption,
  .rocket-auto__artifact > figcaption, .rocket-system__figure > figcaption,
  .novant__artifact > figcaption, .narrative-case__media figcaption,
  .captain-case__media-item > figcaption, .olive-case__media-caption,
  .olive-case__source-caption, .olive-case__nation-caption,
  .eggo-case__source-caption, .rocket-evidence > figcaption,
  .cummins-product-case__artifact > figcaption,
  .rocket-planning-package > figcaption, .media-figure > figcaption
),
:root :is(.financial-case--aaa, .financial-case__content--dfcu,
  .financial-case__content--farmington,
  main[data-portfolio-route="/janus-capital-digital-experience-content-strategy"])
  figure > figcaption {
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
}

/* Per-side chapter padding matches the existing modern case cadence.
   Current column grids and internal media spacing remain component-owned. */
:root main[data-portfolio-route] :is(
  .chapter, .batch-case__section, .employer-story__chapter,
  .rocket-auto__section, .rocket-system__section, .novant__section,
  .narrative-case__section-inner, .captain-case__section,
  .olive-case__section, .eggo-case__section
) {
  padding-block: var(--jt-case-chapter-space);
}
/* Rocket content uses top-only section spacing, so preserve that structure. */
:root .rocket-page > .rocket-section {
  padding-top: var(--jt-case-chapter-space);
}

/* Header roles have one owner across centered and editorial compositions. */
html:root main[data-portfolio-route] :is(
  .case-masthead__metadata, .leadership-masthead__eyebrow,
  .employer-story__heading > .employer-story__eyebrow,
  .masthead > .role, .intro > .eyebrow, .intro > .kicker,
  .farm-intro > .eyebrow, .farm-intro > .kicker,
  .rocket-masthead > .eyebrow, .rocket-masthead > .rocket-eyebrow,
  .case-header__metadata
) {
  color: var(--jt-color-orange, #ED851D);
  font: 600 var(--jt-case-metadata-size)/var(--jt-case-metadata-leading) Montserrat, Arial, sans-serif;
  letter-spacing: .095em;
  text-transform: uppercase;
}
html:root main[data-portfolio-route] :is(
  .case-masthead__subline, .leadership-masthead__subline,
  .employer-story__subtitle, .masthead > .subtitle, .intro-copy > h2,
  .rocket-masthead > .subline, .case-header__subtitle
) {
  font: 600 var(--jt-case-subtitle-size)/var(--jt-case-subtitle-leading) Montserrat, Arial, sans-serif;
  letter-spacing: normal;
  color: #f4f4f2;
  text-wrap: balance;
}
html:root main[data-portfolio-route] > .case-header--editorial {
  text-align: left;
  margin: 0;
  padding: 0;
}
html:root main[data-portfolio-route] > .case-header--editorial > :is(
  .case-masthead__title, .case-header__subtitle, .case-header__context,
  .case-header__summary, .case-header__introduction
) {
  text-align: left;
  width: 100%;
  margin-inline: 0;
}
html:root main[data-portfolio-route] .case-header__metadata { margin: 0 0 16px; }
html:root main[data-portfolio-route] .case-header__subtitle { max-width: 870px; margin-block: 18px 0; }
html:root main[data-portfolio-route] :is(.case-header__summary, .case-header__introduction) {
  max-width: 780px;
  margin-block: 24px 0;
  font: 400 var(--jt-case-reading-size)/var(--jt-case-reading-leading) Montserrat, Arial, sans-serif;
  color: #d7d8da;
  letter-spacing: normal;
  border: 0;
  padding: 0;
}
html:root main[data-portfolio-route] .case-header__context {
  font: 400 13px/20px Montserrat, Arial, sans-serif;
  color: #aaa;
  letter-spacing: normal;
  margin-block: 18px 0;
  border: 0;
  padding: 0;
}
html:root main[data-portfolio-route] .case-header__client-name {
  display: block;
}
html:root main[data-portfolio-route] .case-header__project-name {
  display: block;
  margin-top: 18px;
  font: 600 var(--jt-case-subtitle-size)/var(--jt-case-subtitle-leading) Montserrat, Arial, sans-serif;
  letter-spacing: normal;
  color: #f4f4f2;
}
html:root main[data-portfolio-route]:has(.case-header__client-name) .case-header__subtitle {
  margin-top: 28px;
  font: 600 var(--jt-case-reading-size)/var(--jt-case-reading-leading) Montserrat, Arial, sans-serif;
}
html:root main[data-portfolio-route] .case-header__introduction > p {
  font: inherit;
  color: inherit;
  margin: 0 0 18px;
}
html:root main[data-portfolio-route] .case-header__introduction > p:last-child { margin-bottom: 0; }

/* Reusable group and callout roles retain hierarchy without display-sized prose. */
html:root main[data-portfolio-route] :is(.batch-case__diagram > h3,
  .rocket-system__progression h3, .rocket-system__related strong) {
  font: 700 var(--jt-case-group-size)/var(--jt-case-group-leading) Arimo, Arial, sans-serif;
  letter-spacing: -.015em;
}
html:root main[data-portfolio-route] :is(.rocket-system__quote > p,
  .narrative-case__copy--split > p:first-child,
  .narrative-case__copy--emphasis > p[data-copy-emphasis="primary"]) {
  font: 700 var(--jt-case-callout-size)/var(--jt-case-callout-leading) Arimo, Arial, sans-serif;
  letter-spacing: -.015em;
}

/* Collaboration is a full-width chapter organism. */
html:root main[data-portfolio-route] .employer-story__chapter > .work-credit-block {
  grid-column: 1 / -1;
}

/* A visible affordance complements the detailed flow's keyboard label. */
.batch-case__pan-cue { display: none; }
@media (max-width: 940px) {
  html:root main[data-portfolio-route] .batch-case__pan-cue {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 12px;
    color: #b8b9bd;
    font: 400 12px/19px Montserrat, Arial, sans-serif;
  }
  .batch-case__pan-cue > span { color: var(--jt-color-orange, #ED851D); }
}