/* ==========================================================================
   Industry page v2 — marketing-site redesign (Industry Page.dc.html)
   Loaded only by _layouts/industry-v2.html on top of v2-core.css.
   Template-specific classes are prefixed indv2- so parallel v2 templates
   never collide.
   ========================================================================== */

/* ==========================================================================
   Hero intro — markdownified, so it arrives as one or more <p>
   ========================================================================== */

/* ==========================================================================
   Numbered rows (bound to the page's own main.tips)
   ========================================================================== */
.indv2-process-head { margin-top: 40px; padding-top: 32px; border-top: 1px solid #DFE3EA; scroll-margin-top: 16px; }
.indv2-process-head h2 { margin-bottom: 10px; }
.indv2-process-head__note { margin: 0; font-size: 16px; line-height: 1.6; color: #414B5E; max-width: 60ch; }

.indv2-stages { margin-top: 22px; }
.indv2-stages ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0,1fr); gap: 0; }
.indv2-stage { display: grid; grid-template-columns: 34px minmax(0,1fr); column-gap: 20px; min-width: 0; }
.indv2-stage__railcell { position: relative; display: flex; justify-content: center; }
.indv2-stage__rail { position: absolute; top: 34px; bottom: 0; left: 50%; width: 2px; margin-left: -1px; background: #DFE3EA; }
.indv2-stage__node {
  position: relative; z-index: 1; width: 34px; height: 34px; border-radius: 50%; flex: none;
  display: flex; align-items: center; justify-content: center;
  font: 500 15px 'IBM Plex Mono', monospace;
  background: #fff; color: #5A6478; border: 1.5px solid #DFE3EA;
}
.indv2-stage__node.is-test { background: #1257E8; color: #fff; border-color: #1257E8; }
.indv2-stage__body { min-width: 0; padding: 0 0 34px; }
.indv2-stage.is-last .indv2-stage__body { padding-bottom: 0; }
.indv2-stage__titlerow { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 5px; }
.indv2-stage__titlerow h3 { margin: 0; font-size: 19px; line-height: 1.3; font-weight: 500; color: #14203A; }
.tv2 a.indv2-stage__pill {
  font: 500 11px/1 'IBM Plex Mono', monospace; letter-spacing: .06em; text-transform: uppercase;
  color: #1257E8; background: #EEF4FF; border: 1px solid #C9DCFF; padding: 5px 8px;
  border-radius: 999px; text-decoration: none;
}
.tv2 a.indv2-stage__pill:hover { background: #DCE8FF; color: #1257E8; text-decoration: none; }
.indv2-stage__body > p { margin: 0 0 12px; font-size: 16px; line-height: 1.6; color: #414B5E; max-width: 62ch; text-wrap: pretty; }
/* Tip bodies come through markdownify, so they arrive as one or more <p>. */
.indv2-stage__prose > * { margin: 0 0 12px; }
.indv2-stage__prose > *:last-child { margin-bottom: 0; }
.indv2-stage__prose p { font-size: 16px; line-height: 1.6; color: #414B5E; max-width: 62ch; text-wrap: pretty; }
.tv2 .indv2-stage__prose ul { list-style: disc; padding-left: 20px; }
.tv2 .indv2-stage__prose ol { list-style: decimal; padding-left: 20px; }
.indv2-stage__prose li { font-size: 16px; line-height: 1.6; color: #414B5E; max-width: 60ch; }

/* ==========================================================================
   Rail: at-a-glance card (contents card reuses tv2-toc)
   ========================================================================== */

/* ==========================================================================
   Sample question
   ========================================================================== */
.indv2-sample { padding: 44px 0 0; scroll-margin-top: 16px; }
.indv2-sample h2 { margin-bottom: 10px; }
.indv2-sample__note { margin: 0 0 26px; font-size: 16px; line-height: 1.6; color: #414B5E; max-width: 62ch; }

.indv2-q { margin: 0 0 20px; padding: 26px; border: 1px solid #DFE3EA; border-radius: 10px; background: #fff; min-width: 0; }
.indv2-q__tags { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.indv2-q__num { font: 600 13px 'IBM Plex Mono', monospace; color: #14203A; font-variant-numeric: tabular-nums; }
.indv2-q__tag {
  font: 500 11px/1 'IBM Plex Mono', monospace; letter-spacing: .06em; text-transform: uppercase;
  color: #5A6478; background: #F6F8FC; border: 1px solid #DFE3EA; padding: 5px 8px; border-radius: 999px;
}
.indv2-q__grid { display: grid; grid-template-columns: minmax(min(300px,100%),1fr) minmax(min(280px,100%),360px); gap: 28px 40px; align-items: start; }
.indv2-q__stem { min-width: 0; }
.indv2-q__body { margin: 0 0 16px; font-size: 17px; line-height: 1.6; color: #14203A; max-width: 58ch; text-wrap: pretty; }
.indv2-q__stimulus { margin: 0; padding: 16px 18px; background: #F6F8FC; border-radius: 8px; font-size: 16px; line-height: 1.65; color: #414B5E; max-width: 60ch; }
.indv2-q__options { display: grid; grid-template-columns: minmax(0,1fr); gap: 10px; align-content: start; }
.indv2-q__option {
  display: flex; align-items: center; gap: 14px; padding: 15px 17px; border-radius: 8px;
  cursor: pointer; min-height: 56px; border: 1.5px solid #DFE3EA; background: #fff; position: relative;
}
.indv2-q__option:hover { border-color: #1257E8; }
.indv2-q__option input { position: absolute; opacity: 0; width: 0; height: 0; }
.indv2-q__letter {
  width: 30px; height: 30px; border-radius: 50%; flex: none; display: flex; align-items: center;
  justify-content: center; font: 500 14px 'IBM Plex Mono', monospace;
  border: 1.5px solid #C7CCD8; background: #fff; color: #5A6478;
}
.indv2-q__opt-body { font-size: 16px; line-height: 1.5; color: #14203A; font-variant-numeric: tabular-nums; }
.indv2-q__opt-mark { margin-left: auto; font: 500 12px 'IBM Plex Mono', monospace; color: #5A6478; }
.indv2-q__option.is-revealed-right { border-color: #0E7A50; background: #E6F6EE; }
.indv2-q__option.is-revealed-right .indv2-q__letter { border-color: #0E7A50; background: #0E7A50; color: #fff; }
.indv2-q__option.is-revealed-right .indv2-q__opt-body { font-weight: 500; }
.indv2-q__option.is-revealed-right .indv2-q__opt-mark { color: #0E7A50; }
.indv2-q__option.is-revealed-right .indv2-q__opt-mark::after { content: 'Correct answer'; }
.indv2-q__option.is-picked-right .indv2-q__opt-mark::after { content: 'Correct, your answer'; }
.indv2-q__option.is-picked-wrong { border-color: #C22A22; background: #FCEBEA; }
.indv2-q__option.is-picked-wrong .indv2-q__letter { border-color: #C22A22; background: #C22A22; color: #fff; }
.indv2-q__option.is-picked-wrong .indv2-q__opt-mark { color: #C22A22; }
.indv2-q__option.is-picked-wrong .indv2-q__opt-mark::after { content: 'Your answer'; }
.indv2-q__mark { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid #EDEFF4; font-size: 15px; line-height: 1.5; color: #5A6478; }
.indv2-q__mark.is-right { color: #0E7A50; }
.indv2-q__mark.is-wrong { color: #C22A22; }
/* Figure for grid/sequence stems (firefighter, retail) */
.indv2-q__image { display: block; margin: 16px 0 0; max-width: 100%; height: auto; border: 1px solid #DFE3EA; border-radius: 8px; background: #fff; }

/* ==========================================================================
   Score panel
   ========================================================================== */
.indv2-score {
  margin-bottom: 56px; border: 1px solid #DFE3EA; border-radius: 10px; background: #fff; overflow: hidden;
  box-shadow: 0 1px 2px rgba(20,32,58,.06), 0 2px 8px rgba(20,32,58,.05);
}
.indv2-score__inner { margin: 0; min-width: 0; padding: 28px; }
.indv2-score__copy { min-width: 0; }
/* Copy-only variant: the chart and its five figure rows were sourced for the
   Energy exemplar alone and have been removed, so the copy takes the full width. */
.indv2-score--copyonly .indv2-score__copy h3 { max-width: none; }
.indv2-score--copyonly .indv2-score__body { max-width: 68ch; }
.indv2-score__eyebrow { margin: 0 0 12px; font: 500 11px/1 'IBM Plex Mono', monospace; letter-spacing: .07em; text-transform: uppercase; color: #5A6478; }
.indv2-score__copy h3 { margin: 0 0 10px; font-size: 22px; line-height: 1.3; font-weight: 500; color: #14203A; max-width: 28ch; text-wrap: balance; }
.indv2-score__body { margin: 0; font-size: 16px; line-height: 1.6; color: #414B5E; max-width: 44ch; text-wrap: pretty; }

/* ==========================================================================
   Test-type cards
   ========================================================================== */
.tv2 a.indv2-type {
  display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 12px; align-items: start;
  background: #fff; border: 1px solid #DFE3EA; border-radius: 9px; padding: 13px 14px; text-decoration: none;
}

/* ==========================================================================
   Guide extras (markdown h3s)
   ========================================================================== */
/* The site-wide reset strips list markers; restore them inside the guide */

/* ==========================================================================
   FAQs (bound to the page's own main.faqs)
   ========================================================================== */

/* ==========================================================================
   Trademark note
   ========================================================================== */
.indv2-note { background: #F6F8FC; border-top: 1px solid #E3E8F0; padding: 20px 0; }
.indv2-note p { margin: 0; font-size: 13px; line-height: 1.6; color: #5A6478; }

/* ==========================================================================
   Responsive — behaviour per the design's breakpoint set
   ========================================================================== */
@media (max-width: 980px) {
  .indv2-q__grid { grid-template-columns: minmax(0,1fr); gap: 28px; }
}
@media (max-width: 620px) {
  .indv2-q__options { grid-template-columns: minmax(0,1fr); }
}
