/*
 * Page styles of /craft-studio/ (PKG-RPCVS6). Every selector starts with the page-craft-studio body class (plan §8.3).
 * Layout only: the tiles, the checklists, the split and the dark bands are the shared classes of site.css; this file
 * adds the opening figure, the capability tiles, the TCO infographic after the business benefits, the highlighted statement of "Technológia és integráció" and the
 * closing call above the download block of three cards (PKG-BTWEP2; the download cards of the industry EMS pages).
 */

/* --- Opening figure: a white illustration on the white section, centered, never wider than its own 577 px --- */
.page-craft-studio .craft__overview {
  margin: 0;
  display: grid;
  justify-items: center;
}

.page-craft-studio .craft__overview-frame {
  width: 100%;
  max-width: 36.0625rem;
}

.page-craft-studio .craft__overview-frame img {
  height: auto;
}

/* --- Mit tudhat a megoldás? The bold label leads the paragraph, as in the document --- */
.page-craft-studio .craft__capabilities {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-craft-studio .craft__capabilities p {
  margin: 0;
}

.page-craft-studio .craft__capabilities strong {
  color: var(--c-text);
}

/* --- The TCO infographic after the benefit list: container width on a paper frame, like the Consulting infographic --- */
.page-craft-studio .craft__tco {
  margin: var(--space-8) 0 0;
}

.page-craft-studio .craft__tco-frame {
  background: var(--c-paper);
  border: 1px solid var(--c-line);
}

.page-craft-studio .craft__tco-frame img {
  height: auto;
}

.page-craft-studio .craft__tco-caption {
  margin-top: var(--space-4);
  max-width: 72ch;
  color: var(--c-text-2);
  font-size: var(--fs-0);
}

.page-craft-studio .craft__tco-caption a {
  white-space: nowrap;
}

/* --- Technológia és integráció: the document's bold statement as a turquoise-ruled callout --- */
.page-craft-studio .craft__integration p:not(.lead) {
  margin: 0 0 var(--space-4);
}

.page-craft-studio .craft__callout {
  padding: var(--space-4) var(--space-5);
  border-left: 3px solid var(--c-turq);
  background: var(--c-paper);
}

.page-craft-studio .craft__callout strong {
  color: var(--c-text);
}

/* --- The closing call above the download block --- */
.page-craft-studio .craft__cta {
  max-width: 48rem;
}

.page-craft-studio .craft__cta .lead {
  margin-bottom: var(--space-5);
}

.page-craft-studio .craft__cta-action {
  margin: 0;
}

/* --- The download block: three cards, stacked on narrow screens and in one row from 60em (buttons aligned at the bottom) --- */
.page-craft-studio .craft__downloads {
  display: grid;
  gap: var(--space-6);
  margin-top: var(--space-8);
}

@media (min-width: 60em) {
  .page-craft-studio .craft__downloads {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.page-craft-studio .craft__downloads .download-card {
  color: var(--c-text);
}