/* A continuous walkthrough of one saved firmware assessment. */
.sample-hero { padding-block: 4rem 2rem; }
body[data-page="sample-assessment"] h1 { margin: 1rem 0; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.1; letter-spacing: -.04em; }
.sample-hero .lede { max-width: 65ch; }
.sample-identity { font: .75rem/1.6 var(--mono); margin-block: 1.5rem; }
.sample-totals { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; padding: 1.5rem 0; margin: 2rem 0 0; border-top: 1px solid var(--rule); }
.sample-totals dt { font-size: .8125rem; }
.sample-totals dd { margin: .5rem 0 0; color: var(--cyan); font-size: clamp(1.5rem,3vw,2.5rem); font-weight: 600; }
.sample-steps { display: flex; flex-wrap: wrap; gap: .75rem 2rem; padding-block: 1.5rem; font: .75rem/1.6 var(--mono); }
.sample-step { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.6fr); gap: 3rem; padding-block: 3rem; border-top: 1px solid var(--rule); scroll-margin-top: 6rem; }
.sample-step-copy { min-width: 0; }
.sample-step-copy h2, .sample-next h2 { font-size: clamp(1.5rem,2.5vw,2rem); line-height: 1.15; }
.sample-step-copy code { overflow-wrap: anywhere; font-size: .8125rem; }
.sample-shot { min-width: 0; margin: 0; }
.sample-shot a { display: block; border: 1px solid var(--rule); border-radius: .5rem; overflow: hidden; }
.sample-shot img { display: block; width: 100%; height: auto; }
.sample-shot figcaption { margin-top: .75rem; font-size: .75rem; line-height: 1.5; }
.sample-next { padding-block: 3rem 4rem; border-top: 1px solid var(--rule); }
.sample-next-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2rem; margin-block: 2rem; }
.sample-next-grid h3 { font-size: 1.125rem; }
@media (max-width: 900px) {
  .sample-step { grid-template-columns: minmax(0,1fr); gap: 1rem; }
  .sample-step-copy { max-width: 65ch; }
}
@media (max-width: 640px) {
  .sample-hero { padding-top: 2.5rem; }
  .sample-totals { gap: .75rem; }
  .sample-totals dt { font-size: .6875rem; }
  .sample-next-grid { grid-template-columns: minmax(0,1fr); gap: 1rem; }
  .sample-step { padding-block: 2rem; }
}
