.progression-guide { width: min(100%, 800px); margin: 0 auto; padding: 2rem var(--space-page) 3rem; line-height: 1.9; overflow-wrap: anywhere; }
.progression-guide nav { font-size: .82rem; color: var(--text-muted); margin-bottom: 2rem; }
.progression-guide a { color: var(--accent); text-underline-offset: .2em; }
.progression-guide h1 { font-size: clamp(1.8rem, 5vw, 2.65rem); line-height: 1.4; margin: .5rem 0; }
.progression-guide h2 { font-size: clamp(1.2rem, 3vw, 1.5rem); line-height: 1.5; margin: 0 0 1rem; }
.progression-guide p { margin: 0 0 1rem; }
.progression-guide section { margin-top: 2.75rem; }
.progression-guide__eyebrow { color: var(--accent); font-weight: 700; font-size: .85rem; }
.progression-guide__lead { color: var(--text-muted); font-size: 1.12rem; }
.progression-guide__chords { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; margin: 1.5rem 0; }
.progression-guide__chords span { display: grid; text-align: center; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: .7rem .2rem; }
.progression-guide__chords strong { font-size: 1.8rem; color: var(--chord); }
.progression-guide__chords small { color: var(--text-muted); }
.progression-guide a.progression-guide__cta { display: inline-block; color: var(--bg); background: var(--accent); font-weight: 700; text-decoration: none; border-radius: var(--radius-sm); padding: .8rem 1.1rem; line-height: 1.6; }
.progression-guide a:focus-visible { outline: 3px solid var(--text); outline-offset: 4px; }
.progression-guide__note { color: var(--text-muted); font-size: .82rem; margin-top: .5rem !important; }
.progression-guide ol { padding-left: 1.6rem; }
.progression-guide li { padding-left: .3rem; margin-bottom: .8rem; }
.progression-guide__notice { background: var(--surface); border-left: 3px solid var(--accent); padding: 1rem; border-radius: var(--radius-sm); }
.progression-guide__related { margin-top: 2.5rem !important; padding-top: 1.25rem; border-top: 1px solid var(--border); }
