/* Case layout only. Typography, spacing, labels, buttons and motion belong to Codexo. */
.codexo-case-hero :where(h1, h2, p, figure, dl, dd),
.codexo-case-section :where(h1, h2, p, figure, dl, dd),
.codexo-case-teaser :where(h2, p) { margin: 0; }
.codexo-case-study :where(p, dd, figcaption),
.codexo-case-teaser :where(h2, p) { overflow-wrap: anywhere; }
.codexo-case-back { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: var(--codexo-content-space); color: var(--_colors-plates---secondary); text-decoration: underline; text-underline-offset: 4px; }
.codexo-case-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; column-gap: var(--codexo-grid-gap); }
.codexo-case-heading > div { display: grid; grid-template-rows: subgrid; grid-row: span 3; justify-items: start; }
.codexo-case-heading .section-title { display: block; margin: 0; }
.codexo-case-heading .codexo-case-lead { margin-top: 16px; }
.codexo-case-lead, .codexo-case-copy { font-size: var(--_typography---titles--h5); line-height: 1.6; color: var(--_colors-plates---gray); }
.codexo-case-year { grid-column: 2; grid-row: 2; align-self: start; font-size: var(--_typography---titles--h4); font-weight: 700; line-height: 1.2; }
.codexo-case-facts { display: grid; grid-template-columns: 1fr; gap: var(--codexo-content-space) var(--codexo-grid-gap); margin-block: var(--codexo-content-space); padding-block: var(--codexo-content-space); border-block: 1px solid #d3d3da; }
.codexo-case-facts > div { display: grid; gap: 8px; min-width: 0; }
.codexo-case-facts dt { color: var(--_colors-plates---gray); font-size: var(--_typography---paragraphs--lg-body); }
.codexo-case-facts dd { font-size: var(--_typography---titles--h6); font-weight: 700; }
.codexo-case-media { min-width: 0; }
.codexo-case-media img { display: block; width: 100%; height: auto; border: 1px solid #dedee3; border-radius: var(--codexo-card-radius); }
.codexo-case-media figcaption { margin-top: 12px; font-size: var(--_typography---paragraphs--lg-body); color: var(--_colors-plates---gray); line-height: 1.6; }
.codexo-case-story { display: grid; gap: var(--codexo-content-space); }
.codexo-case-story > *, .codexo-case-outcome-heading { min-width: 0; }
.codexo-case-story .codexo-section-label, .codexo-case-outcome-heading .codexo-section-label, .codexo-case-teaser .codexo-section-label { margin-bottom: 0; }
.codexo-case-story h2, .codexo-case-outcome-heading h2 { margin-top: 14px; font-size: var(--_typography---titles--h2); line-height: 1.2; }
.codexo-case-copy p + p, .codexo-case-outcome-heading > p { margin-top: var(--codexo-content-space); }
.codexo-case-section--muted { background: var(--_colors-plates---light-gray); }
.codexo-case-gallery { margin-top: var(--codexo-content-space); }
div.codexo-case-gallery { display: grid; gap: var(--codexo-grid-gap); align-items: start; }
.codexo-case-mobile-stage { display: flex; justify-content: center; padding: var(--codexo-card-space); background: var(--_colors-plates---light-gray); border-radius: var(--codexo-card-radius); }
.codexo-case-mobile-stage img { max-width: 290px; }
.codexo-case-outcome-heading > p { font-size: var(--_typography---paragraphs--lg-body); color: var(--_colors-plates---gray); line-height: 1.6; }
.codexo-case-outcome-heading > .codexo-button { margin-top: var(--codexo-content-space); }
.codexo-case-teaser { margin-block: var(--codexo-content-space); }
.codexo-case-teaser-link { display: grid; align-items: start; gap: var(--codexo-grid-gap); padding-block: var(--codexo-content-space); border-block: 1px solid #d3d3da; text-decoration: none; color: var(--_colors-plates---primary); }
.codexo-case-teaser-link > div { min-width: 0; }
.codexo-case-teaser img { display: block; width: 100%; height: auto; border-radius: var(--codexo-card-radius); border: 1px solid #dedee3; }
.codexo-case-teaser h2 { margin-top: 14px; font-size: var(--_typography---titles--h3); }
.codexo-case-teaser p { margin-top: 16px; color: var(--_colors-plates---gray); font-size: var(--_typography---paragraphs--lg-body); line-height: 1.6; }
.codexo-case-teaser-action { display: block; margin-top: var(--codexo-content-space); color: var(--_colors-plates---secondary); font-size: var(--_typography---paragraphs--lg-body); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.codexo-case-teaser-link:hover h2 { color: var(--_colors-plates---secondary); }
.codexo-case-back:focus-visible, .codexo-case-teaser-link:focus-visible { outline: 3px solid var(--_colors-plates---secondary); outline-offset: 4px; }
@media (min-width: 580px) {
  .codexo-case-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 8px; }
  .codexo-case-facts > div { grid-template-rows: subgrid; grid-row: span 2; }
}
@media (min-width: 820px) {
  .codexo-case-story { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); column-gap: var(--codexo-content-space); row-gap: 14px; }
  /* One shared label row aligns the lead with the headline, not with its badge. */
  .codexo-case-story > header { display: grid; grid-template-rows: subgrid; grid-row: span 2; justify-items: start; }
  .codexo-case-story > header h2 { margin: 0; }
  .codexo-case-story > .codexo-case-copy { grid-column: 2; grid-row: 2; }
  div.codexo-case-gallery { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
  .codexo-case-teaser-link { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); }
}