/* Shared sequential process pattern. Copy and labels belong in the right card.
   Markup: ol.lyl-process-pattern > li > .lyl-process-pattern__number + .lyl-process-pattern__body */
body:not(.home) main ol.lyl-process-pattern {
  --process-rail: 90px;
  --process-circle: 70px;
  --process-axis: 45px;
  position: relative;
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  list-style: none;
}
body:not(.home) main ol.lyl-process-pattern::before { content: none; }
body:not(.home) main ol.lyl-process-pattern > li {
  position: relative;
  display: grid;
  grid-template-columns: var(--process-rail) minmax(0, 1fr);
  grid-template-rows: auto;
  align-items: start;
  gap: 0 24px;
  min-height: 0;
  margin: 0;
  padding: 0 0 36px;
  border: 0;
  background: transparent;
  text-align: left;
}
body:not(.home) main ol.lyl-process-pattern > li:last-child { padding-bottom: 0; }
body:not(.home) main ol.lyl-process-pattern > li:not(:last-child)::before {
  content: '';
  position: absolute;
  top: calc(var(--process-circle) / 2);
  bottom: calc(var(--process-circle) / -2);
  left: var(--process-axis);
  width: 1px;
  height: auto;
  background: #a8873f;
  transform: translateX(-50%);
}
body:not(.home) main ol.lyl-process-pattern > li:last-child::before { content: none; }
body:not(.home) main ol.lyl-process-pattern > li:not(:last-child)::after {
  content: '';
  position: absolute;
  top: auto;
  right: auto;
  bottom: 18px;
  left: var(--process-axis);
  box-sizing: border-box;
  width: 9px;
  height: 9px;
  margin: 0;
  border: 0;
  border-right: 1px solid #a8873f;
  border-bottom: 1px solid #a8873f;
  background: transparent;
  transform: translateX(-50%) rotate(45deg);
}
body:not(.home) main ol.lyl-process-pattern > li:last-child::after { content: none; }
body:not(.home) main ol.lyl-process-pattern > li > .lyl-process-pattern__number {
  position: relative;
  z-index: 1;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  grid-column: 1;
  grid-row: 1;
  justify-self: center;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: var(--process-circle);
  height: var(--process-circle);
  margin: 0;
  padding: 0;
  border: 1px solid #a8873f;
  border-radius: 50%;
  background: #fff;
  color: #806329;
  font: 500 16px/1 var(--lyl-sans);
  transform: none;
}
body:not(.home) main ol.lyl-process-pattern > li > .lyl-process-pattern__body {
  grid-column: 2;
  grid-row: 1;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0;
  padding: 28px 32px;
  border: 1px solid var(--lyl-line, #ddd5c4);
  border-left: 3px solid #a8873f;
  background: #faf8f3;
  color: #24332b;
}
body:not(.home) main .lyl-process-pattern__body > :is(small, .lyl-support-flow__label) {
  display: block;
  margin: 0 0 8px;
  color: #806329;
  font: 700 13px/1.6 var(--lyl-sans);
  letter-spacing: .03em;
}
body:not(.home) main .lyl-process-pattern__body > :is(h3, strong) {
  display: block;
  margin: 0 0 12px;
  padding: 0;
  color: #172c25;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
  text-align: left;
}
body:not(.home) main .lyl-process-pattern__body > p { margin: 0 0 14px; color: #5b685f; font-size: 15px; line-height: 1.95; }
body:not(.home) main .lyl-process-pattern__body > :last-child { margin-bottom: 0; }
@media (max-width: 760px) {
  body:not(.home) main ol.lyl-process-pattern { --process-rail: 50px; --process-circle: 44px; --process-axis: 25px; }
  body:not(.home) main ol.lyl-process-pattern > li { column-gap: 12px; padding-bottom: 28px; }
  body:not(.home) main ol.lyl-process-pattern > li > .lyl-process-pattern__number { font-size: 13px; }
  body:not(.home) main ol.lyl-process-pattern > li > .lyl-process-pattern__body { padding: 20px 18px; }
  body:not(.home) main .lyl-process-pattern__body > :is(h3, strong) { font-size: 17px; }
  body:not(.home) main ol.lyl-process-pattern > li:not(:last-child)::after { bottom: 14px; }
}

/* Default eyebrow for steps without an editorial label. */
body:not(.home) main ol.lyl-process-pattern { counter-reset: process-step; }
body:not(.home) main ol.lyl-process-pattern > li { counter-increment: process-step; }
body:not(.home) main .lyl-process-pattern__body:not(:has(> small))::before {
  content: "STEP " counter(process-step);
  display: block;
  margin: 0 0 8px;
  color: #806329;
  font: 700 13px/1.6 var(--lyl-sans);
  letter-spacing: .03em;
}