/* Process steps: how books are made, honestly. Numbered, each with a real story page.
   API: <ol class="db-steps"> <li class="db-step"> <span class="db-step__num"> <img class="db-step__img"> */
.db-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--db-s7)}
@media (max-width:820px){.db-steps{grid-template-columns:1fr;gap:var(--db-s8)}}

.db-step{display:flex;flex-direction:column;gap:var(--db-s3)}
.db-step__num{font-size:clamp(2.5rem,1.9rem + 2.2vw,3.6rem);font-weight:800;line-height:1;
  color:var(--db-gold);font-variant-numeric:tabular-nums}
.db-step__img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--db-r-lg);
  box-shadow:var(--db-shadow-2)}
.db-step__title{font-size:var(--db-fs-h3);font-weight:700}
.db-step__text{color:var(--fg-muted)}