.roadmap-hero{padding:clamp(3rem,8vw,6rem) 0 2.5rem;border-bottom:1px solid var(--border)}
.roadmap-intro{display:grid;gap:1.5rem}.roadmap-progress{padding:1.1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.progress-head{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.7rem;font:.7rem var(--font-mono);color:var(--muted)}.progress-track{height:8px;overflow:hidden;border-radius:999px;background:var(--surface-3)}.progress-fill{height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .4s ease}
.roadmap-shell{padding:clamp(2rem,6vw,5rem) 0}.roadmap-level{position:relative;margin-bottom:4rem}.level-heading{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:.8rem;width:max-content;max-width:100%;margin-bottom:1rem;padding:.55rem .7rem;border:1px solid var(--border);border-radius:14px;background:var(--bg-elevated);box-shadow:0 8px 25px rgba(0,0,0,.18)}.level-heading strong{font:700 1.15rem var(--font-display)}.level-heading span:last-child{color:var(--muted);font:.65rem var(--font-mono)}
.roadmap-list{position:relative;display:grid;gap:.75rem;padding-left:1rem}.roadmap-list::before{content:"";position:absolute;left:1.42rem;top:1rem;bottom:1rem;width:1px;background:linear-gradient(var(--level-color),var(--border))}
.roadmap-node{position:relative;display:grid;grid-template-columns:48px 1fr auto;gap:.8rem;align-items:center;min-height:116px;padding:1rem 1rem 1rem .7rem;margin-left:0;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);text-decoration:none;transition:transform .18s,border-color .18s}.roadmap-node:hover{transform:translateX(4px);border-color:var(--border-strong)}
.node-marker{position:relative;z-index:2;width:48px;height:48px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--topic-color) 40%,var(--border));border-radius:50%;background:var(--bg-elevated);font-size:1.15rem}.roadmap-node[data-visited="true"] .node-marker::after{content:"✓";position:absolute;right:-3px;bottom:-3px;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:var(--success);color:#102017;font:800 .58rem var(--font-mono)}
.node-copy small{color:var(--topic-color);font:.62rem var(--font-mono);text-transform:uppercase}.node-copy h3{margin:.1rem 0;font:700 1rem var(--font-ui)}.node-copy p{margin:0;color:var(--muted);font-size:.76rem}.node-order{color:var(--dim);font:.65rem var(--font-mono)}
.roadmap-note{padding:1rem;border:1px solid var(--border);border-radius:14px;color:var(--muted);font-size:.82rem;background:var(--surface)}
@media (max-width:520px){.progress-head{display:grid;gap:.25rem}.roadmap-node{grid-template-columns:48px minmax(0,1fr) auto}.node-copy p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}}
@media (min-width:780px){.roadmap-intro{grid-template-columns:1fr 330px;align-items:end}.roadmap-list{grid-template-columns:repeat(2,1fr);padding-left:0}.roadmap-list::before{display:none}.roadmap-node:hover{transform:translateY(-4px)}}
@media (min-width:1100px){.roadmap-list{grid-template-columns:repeat(3,1fr)}.roadmap-node{grid-template-columns:48px 1fr;min-height:145px}.node-order{grid-column:2}}