/* O-13 v2-editorial — rebates #duke. Isolated preview only. Not deployed.
   Bang rejected v1 white cards + giant hollow numerals + icon squares.
   Calm continuous editorial on existing navy. Exact 4 live steps. */

html body #duke.o13v2 .rail {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin-top: 32px !important;
  position: relative !important;
  border-top: 1px solid rgba(254, 209, 77, 0.28) !important;
  padding-top: 28px !important;
}

/* kill live yellow bar */
html body #duke.o13v2 .rail::before {
  display: none !important;
  content: none !important;
}

/* no cards — flush editorial cells */
html body #duke.o13v2 .rail-step {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  padding: 0 28px 0 0 !important;
  text-align: left !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-width: 0 !important;
}

/* vertical hairline between cells (not a box) */
html body #duke.o13v2 .rail-step + .rail-step {
  padding-left: 28px !important;
  border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html body #duke.o13v2 .rail-step:last-child {
  padding-right: 0 !important;
}

/* hide generic icon squares entirely */
html body #duke.o13v2 .rail-ico {
  display: none !important;
}

/* slim understated step marker — small index, not a numeral monument */
html body #duke.o13v2 .rail-step .rk {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.16em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: #FED14D !important;
  -webkit-text-stroke: 0 !important;
  background: none !important;
}

html body #duke.o13v2 .rail-step .rk::before {
  content: "0" !important; /* 01–04 editorial index from live 1–4 */
  font-weight: 800 !important;
}

html body #duke.o13v2 .rail-step h3 {
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  color: #fff !important;
  text-wrap: balance !important;
}

html body #duke.o13v2 .rail-step p {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  max-width: 28ch !important;
}

html body #duke.o13v2 .intro {
  color: rgba(255, 255, 255, 0.82) !important;
  max-width: 62ch !important;
}

/* ---- Tablet: 2×2 editorial, calm gaps ---- */
@media (max-width: 1179px) and (min-width: 700px) {
  html body #duke.o13v2 .rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 0 !important;
    row-gap: 28px !important;
    padding-top: 24px !important;
  }
  html body #duke.o13v2 .rail-step {
    padding: 0 24px 0 0 !important;
  }
  html body #duke.o13v2 .rail-step:nth-child(2n) {
    padding-right: 0 !important;
  }
  html body #duke.o13v2 .rail-step:nth-child(n+3) {
    /* second row: no extra top border noise */
  }
  html body #duke.o13v2 .rail-step + .rail-step {
    padding-left: 24px !important;
  }
  /* reset left border on first of each row */
  html body #duke.o13v2 .rail-step:nth-child(2n+1) {
    border-left: 0 !important;
    padding-left: 0 !important;
  }
  html body #duke.o13v2 .rail-step:nth-child(2n) {
    border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
  }
}

/* ---- Phone: single continuous column ---- */
@media (max-width: 699px) {
  html body #duke.o13v2 .rail {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding-top: 8px !important;
    border-top: 0 !important;
  }
  html body #duke.o13v2 .rail-step {
    padding: 18px 0 18px 16px !important;
    border-left: 2px solid rgba(254, 209, 77, 0.45) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
  }
  html body #duke.o13v2 .rail-step + .rail-step {
    padding-left: 16px !important;
    border-left: 2px solid rgba(254, 209, 77, 0.45) !important;
  }
  html body #duke.o13v2 .rail-step:last-child {
    border-bottom: 0 !important;
  }
  html body #duke.o13v2 .rail-step h3 {
    font-size: 17px !important;
  }
  html body #duke.o13v2 .rail-step p {
    font-size: 13px !important;
    max-width: none !important;
  }
  html body #duke.o13v2 .rail-step .rk {
    font-size: 11px !important;
    margin-bottom: 8px !important;
  }
}
