/* George's plan page (/plan) and the plan links on the homepage cards. Loads after civic.css. */
.plan-draft { margin: 0; padding: .5rem var(--page-gutter); background: var(--color-accent); color: var(--color-ink); font: 600 var(--text-sm)/1.5 var(--font-body); text-align: center; }
.direction-civic .plan-link { justify-self: start; margin-top: var(--space-sm); }
.direction-civic .plan-hero { background: var(--color-ink); color: var(--color-light); padding-block: var(--space-xl) var(--space-2xl); }
.direction-civic .plan-hero .eyebrow { color: var(--color-accent); }
.direction-civic .plan-hero h1 { max-width: 18ch; }
.direction-civic .plan-hero .large { max-width: 48ch; color: var(--color-light-muted); }
.plan-jump { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin: var(--space-lg) 0 0; padding: 0; list-style: none; }
.plan-jump a { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--color-accent); font-size: var(--text-sm); font-weight: 600; text-decoration: none; }
.plan-jump a:hover { background: var(--color-accent); color: var(--color-ink); }
.plan-hero a:focus-visible { outline-color: var(--color-light); }
.plan-timing { max-width: 60ch; margin-top: var(--space-lg); font-size: var(--text-sm); color: var(--color-light-muted); }
.plank { padding-block: var(--space-2xl); }
.plank.alt { background: var(--color-paper-2); }
.plank .eyebrow { margin-bottom: var(--space-xs); }
.plank-lead { max-width: 52ch; }
.plank h3 { margin-top: var(--space-2xl); font-size: 2rem; }
.measure { max-width: 46rem; }
.plank h3 + .measure, .plank h3 + .commitments, .plank h3 + .steps, .plank h3 + ul { margin-top: var(--space-md); }
.plank ul { padding-left: 1.1rem; }
.plank li + li { margin-top: var(--space-xs); }
.commitments { display: grid; gap: var(--space-xl); }
.commitment { max-width: 46rem; border-top: 5px solid var(--color-ink); padding-top: var(--space-md); }
.commitment h4 { margin: 0; font: 600 1.75rem/1.12 var(--font-display); }
.commitment > p { margin-top: var(--space-sm); }
.commitment dl { display: grid; gap: var(--space-sm); margin: var(--space-md) 0 0; padding-top: var(--space-md); border-top: 1px solid var(--color-rule); }
.commitment dt { font-size: var(--text-sm); font-weight: 600; }
.commitment dd { margin: .125rem 0 0; font-size: var(--text-base); }
.plank .steps { max-width: 46rem; }
.gov-grid { display: grid; gap: var(--space-md); margin: var(--space-md) 0 0; padding: 0; list-style: none; }
.gov-grid li { border-top: 1px solid var(--color-rule); padding-top: var(--space-sm); }
.gov-grid li + li { margin-top: 0; }
.gov-grid strong { display: block; font-family: var(--font-display); font-size: 1.375rem; font-weight: 600; }
.not-panel { max-width: 46rem; margin-top: var(--space-2xl); padding: var(--space-md); background: var(--color-paper-2); }
.not-panel h3 { margin-top: 0; }
.plan-ask { padding-block: var(--space-2xl) var(--space-md); }
.plan-ask .actions { margin-top: var(--space-md); }
.plan-sources { padding-block: var(--space-xl); border-top: 1px solid var(--color-rule); }
.plan-sources h2 { font-size: 1.75rem; }
.plan-sources ol { max-width: 60rem; margin: var(--space-sm) 0 0; padding-left: 1.25rem; font-size: var(--text-sm); }
.plan-sources li + li { margin-top: .375rem; }
.plan-sources a { overflow-wrap: anywhere; }
@media (min-width: 64rem) {
  .direction-civic .principles article { grid-row: span 4; }
  .commitments.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gov-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-lg); }
  .not-panel { padding: var(--space-lg); }
}
.plank .follow { margin-top: var(--space-md); }
.plan-sources .source-note { margin-top: var(--space-2xs); }

.landing-hero-grid { display: grid; gap: var(--space-xl); align-items: start; }
.direction-civic .plan-hero h1 { text-transform: none; }
.hero-pathway { background: var(--color-paper); color: var(--color-ink); padding: var(--space-md); border-top: 5px solid var(--color-accent); }
.hero-pathway h2 { font-size: 1.75rem; margin-bottom: var(--space-md); }
.recovery-flow { margin: 0; padding: 0; list-style: none; }
.recovery-flow li { display: grid; justify-items: center; }
.flow-step { display: flex; align-items: center; width: 100%; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--color-rule); border-left: 4px solid var(--color-accent); font-weight: 600; line-height: 1.3; }
.flow-arrow { padding-block: .2rem; font-size: 1.25rem; line-height: 1; }
.intersection-placeholder { display: flex; align-items: center; justify-content: center; min-height: 280px; padding: var(--space-lg); border: 1px dashed var(--color-accent); text-align: center; }
.placeholder-heading { font: 600 1.75rem/1.15 var(--font-display); }
.placeholder-note { color: var(--color-light-muted); font-size: var(--text-sm); }
.plan-hero .actions { margin-top: var(--space-lg); }
.plan-hero .text-link { color: var(--color-light); }
.direction-civic .plan-hero .button { background: var(--color-accent); color: var(--color-ink); border-color: var(--color-accent); }
.direction-civic .plan-hero .button:hover { background: var(--color-light); border-color: var(--color-light); }
.framework { list-style: none; margin: 0; padding: 0; }
.framework > li { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--space-md); padding-block: var(--space-xl); border-top: 1px solid var(--color-rule); }
.point-number { font: 600 2.25rem/1 var(--font-display); color: var(--color-ink); }
.framework h2 { font-size: clamp(1.875rem, 4vw, 2.5rem); max-width: 32ch; }
.framework p { max-width: 46rem; margin-top: var(--space-md); }
.framework .gov-grid { padding-left: 0; }
.pathway { font-weight: 600; }
.commitment h3 { margin-top: 0; }
.commitment .source-note { font-size: var(--text-sm); }
.plan-sources p { margin-top: var(--space-sm); }
@media (min-width: 64rem) {
  .landing-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(20rem, 26rem); }
  .framework > li { grid-template-columns: 5rem minmax(0, 1fr); }
  .framework .gov-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 46rem; }
}