/* ==========================================================================
   case.css — per-block type and layout values for the Banco Inter case
   Everything here mirrors the per-block values the original page emitted
   inline. Font sizes are in `em` against the 10px root (see base.css).
   ========================================================================== */

.page.project {
  --page-background: #000;
  --nav-height: 124px;
}

/*
 * The prev/next nav and the footer sit below the last block, on the black page
 * background, so they take a light ink. Scoped deliberately: blocks keep the
 * global `--color` (#000) they inherit from :root, and each sets its own surface colour inline.
 */
.page.project .project-nav,
.page.project footer {
  --color: #e2e2e2;
  --nav-link-color: #e2e2e2;
}

/*
 * The header does not — it is lifted over the cover, and this cover is light.
 * It was taking the same #e2e2e2 as the chrome below and rendering the nav
 * links all but invisible against the photo.
 */
.page.project > .navigation {
  --color: #000;
  --nav-link-color: #000;
}

/* --- project meta + summary -------------------------------------------- */

/* Set through the shared variables so the mobile clamps still apply. */
.block.meta {
  --label-size: 1.7em;
  --label-leading: 1.51;
  --label-weight: 400;
  --body-size: 2.3em;
  --body-leading: 1.49;
}

.block.meta .meta-list dt {
  color: var(--label-color);
  font-weight: 600;
}

.block.meta .meta-list dd {
  margin: 0;
}

.block.meta .meta-list dd + dt {
  margin-top: 1.51em;
}

/* --- context ----------------------------------------------------------- */
/* col-label 3.5em / 1.2 and col-body 1.7em / 1.61 are the intro defaults. */

/* --- design challenge -------------------------------------------------- */

.block.challenge .col-body {
  --body-size: 2.3em;
  --body-leading: 1.66;
}

/* --- the process ------------------------------------------------------- */

.block.process .col-body {
  --body-size: 1.8em;
}

/* --- solution heading -------------------------------------------------- */

.block.solution .col-body {
  --body-size: 2.5em;
  --body-leading: 1.66;
}

/* --- learnings & insights ---------------------------------------------- */
/* Unlike Context and My Role, this block separated sections by one blank
   line rather than two. */

.block.learnings .col-body {
  --section-gap: 1;
}

/* --- call to action ---------------------------------------------------- */

.block.header .headline {
  color: #f5b780;
}

.block.header .subheadline a {
  color: #fff;
}