/* LIFECYCLE-TRACK-01: state progression with a readable rail and one outcome. */

.lifecycle-track { padding: var(--l-section-padding, clamp(96px, 8vw, 132px) 0); background: var(--l-bg); border-bottom: 1px solid var(--l-line); }
.lifecycle-track__head { margin-bottom: clamp(42px, 5vw, 72px); }
.lifecycle-track__steps { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(12px, 1.5vw, 24px); margin: 0; padding: 0; list-style: none; }
.lifecycle-track__steps[data-lifecycle-columns='1'] { grid-template-columns: 1fr; }
.lifecycle-track__steps[data-lifecycle-columns='2'] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lifecycle-track__steps[data-lifecycle-columns='3'] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lifecycle-track__steps[data-lifecycle-columns='4'] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lifecycle-track__steps[data-lifecycle-columns='5'] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.lifecycle-track__steps::before { position: absolute; z-index: 0; top: 24px; right: 24px; left: 24px; height: 2px; content: ''; background: linear-gradient(90deg, rgba(var(--l-blue-rgb), .55), var(--l-positive)); border-radius: 999px; }
.lifecycle-track__steps li { position: relative; min-width: 0; padding-top: 64px; }
.lifecycle-track__marker,
.lifecycle-track__branch-marker { position: absolute; top: 0; left: 0; z-index: 2; display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; color: var(--l-blue); background: var(--l-deep-surface); border: 1px solid rgba(var(--l-blue-rgb), .65); border-radius: 50%; box-shadow: 0 0 0 7px var(--l-bg), inset 0 0 0 1px rgba(var(--l-blue-rgb), .1); }
.lifecycle-track__number { position: absolute; top: -15px; left: 0; z-index: 3; color: currentColor; font-family: var(--l-font-mono); font-size: 8px; font-weight: 700; line-height: 1; }
.lifecycle-track__icon { position: absolute; top: 50%; left: 50%; display: inline-grid; width: 25px; height: 25px; place-items: center; color: currentColor; line-height: 0; transform: translate(-50%, -50%); --shd-icon-stroke-width: 1.3; }
.lifecycle-track__icon .shd-svg-icon { width: 100%; height: 100%; }
.lifecycle-track__phase { display: block; min-height: 1.35em; margin-bottom: 7px; color: var(--l-text-muted); font-family: var(--l-font-mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.lifecycle-track__steps strong { display: block; color: var(--l-text); font-size: 15px; line-height: 1.25; }
.lifecycle-track__steps p { max-width: 220px; margin: 9px 0 0; color: var(--l-text-soft); font-size: 11px; line-height: 1.5; }
.lifecycle-track__steps li[data-lifecycle-state='outcome'] .lifecycle-track__marker { color: var(--l-positive); background: linear-gradient(rgba(var(--l-positive-rgb), .13), rgba(var(--l-positive-rgb), .13)), var(--l-deep-surface); border-color: rgba(var(--l-positive-rgb), .72); }
.lifecycle-track__steps li[data-lifecycle-state='outcome'] .lifecycle-track__icon,
.lifecycle-track__steps li[data-lifecycle-state='outcome'] strong { color: var(--l-positive); }
.lifecycle-track__note { margin: clamp(30px, 4vw, 52px) 0 0; padding: 14px 18px; color: var(--l-text-soft); background: rgba(var(--l-gold-rgb), .08); border: 1px solid rgba(var(--l-gold-rgb), .18); border-left: 2px solid var(--l-gold); border-radius: var(--l-radius-sm); font-size: 12px; line-height: 1.55; }

.lifecycle-track__branch { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(12px, 1.5vw, 24px); margin-top: 20px; }
.lifecycle-track__branch[data-lifecycle-columns='1'] { grid-template-columns: 1fr; }
.lifecycle-track__branch[data-lifecycle-columns='2'] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lifecycle-track__branch[data-lifecycle-columns='3'] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lifecycle-track__branch[data-lifecycle-columns='4'] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lifecycle-track__branch[data-lifecycle-columns='5'] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.lifecycle-track__branch-item { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 14px; min-width: 0; grid-column: 2; padding: 18px 18px 18px 0; }
.lifecycle-track__branch-item[data-branch-column='1'] { grid-column: 1; }
.lifecycle-track__branch-item[data-branch-column='2'] { grid-column: 2; }
.lifecycle-track__branch-item[data-branch-column='3'] { grid-column: 3; }
.lifecycle-track__branch-item[data-branch-column='4'] { grid-column: 4; }
.lifecycle-track__branch-item[data-branch-column='5'] { grid-column: 5; }
.lifecycle-track__branch-item::before { position: absolute; top: -20px; left: 24px; width: 2px; height: 62px; content: ''; background: rgba(var(--l-gold-rgb), .58); border-radius: 999px; }
.lifecycle-track__branch-marker { position: relative; top: auto; left: auto; width: 48px; height: 48px; color: var(--l-gold); border-color: rgba(var(--l-gold-rgb), .68); box-shadow: inset 0 0 0 1px rgba(var(--l-gold-rgb), .1); }
.lifecycle-track__branch-item strong { display: block; color: var(--l-gold); font-size: 14px; line-height: 1.25; }
.lifecycle-track__branch-item p { max-width: 220px; margin: 7px 0 0; color: var(--l-text-soft); font-size: 11px; line-height: 1.5; }

@media (max-width: 900px) {
	.lifecycle-track__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 34px; }
	.lifecycle-track__steps[data-lifecycle-columns] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.lifecycle-track__steps::before { display: none; }
	.lifecycle-track__branch { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.lifecycle-track__branch[data-lifecycle-columns] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
	.lifecycle-track { padding-block: 72px; }
	.lifecycle-track__head { margin-bottom: 38px; }
	.lifecycle-track__steps { grid-template-columns: 1fr; gap: 0; padding-left: 24px; }
	.lifecycle-track__steps[data-lifecycle-columns] { grid-template-columns: 1fr; }
	.lifecycle-track__steps::before { display: block; top: 24px; right: auto; bottom: 0; left: 24px; width: 2px; height: auto; background: linear-gradient(180deg, rgba(var(--l-blue-rgb), .55), var(--l-positive)); }
	.lifecycle-track__steps li { min-height: 124px; padding: 0 0 28px 64px; }
	.lifecycle-track__marker { top: 0; left: -24px; width: 48px; height: 48px; box-shadow: 0 0 0 5px var(--l-bg); }
	.lifecycle-track__branch { grid-template-columns: 1fr; gap: 0; margin: -4px 0 0; padding-left: 24px; }
	.lifecycle-track__branch[data-lifecycle-columns] { grid-template-columns: 1fr; }
	.lifecycle-track__branch-item,
	.lifecycle-track__branch-item[data-branch-column='1'],
	.lifecycle-track__branch-item[data-branch-column='2'],
	.lifecycle-track__branch-item[data-branch-column='3'],
	.lifecycle-track__branch-item[data-branch-column='4'],
	.lifecycle-track__branch-item[data-branch-column='5'] { grid-column: 1; grid-template-columns: minmax(0, 1fr); padding-left: 64px; border-top: 0; }
	.lifecycle-track__branch-item::before { top: -28px; left: 0; width: 2px; height: 52px; }
	.lifecycle-track__branch-marker { position: absolute; top: 0; left: -24px; }
	.lifecycle-track__phase { min-height: 0; }
}

html[dir='rtl'] .lifecycle-track__steps { direction: rtl; }
html[dir='rtl'] .lifecycle-track__steps p,
html[dir='rtl'] .lifecycle-track__steps strong,
html[dir='rtl'] .lifecycle-track__phase { direction: ltr; text-align: right; }
