.ideas-page { color: var(--ink); background: #fbfaf7; }
.ideas-page main { overflow: clip; }
.ideas-page h1, .ideas-page h2, .ideas-page h3 { font-family: Georgia, "Times New Roman", serif; }

.post-main { padding: 0 24px; }
.post { max-width: 980px; margin: 0 auto; }
.post-header { padding: clamp(72px, 10vw, 120px) 0 58px; border-bottom: 1px solid var(--line); }
.post-kicker { margin: 0 0 18px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.post-kicker::before { content: ""; width: 18px; height: 2px; display: inline-block; margin: 0 9px 3px 0; background: var(--yellow); }
.post-header h1 { margin: 0; font-size: clamp(54px, 7vw, 82px); font-weight: 400; letter-spacing: -.055em; line-height: .96; }
.post-dek { margin: 28px 0 0; color: #536072; font-size: clamp(17px, 1.6vw, 20px); line-height: 1.65; }
.post-meta { display: flex; gap: 18px; margin-top: 28px; color: #929aa6; font-size: 9px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.post-meta span + span::before { content: "·"; margin-right: 18px; }
.post-body { padding: 62px 0 100px; color: #3f4b5b; font-size: 16px; line-height: 1.82; }
.post-body > p { margin: 0 0 25px; }
.post-body .post-lead { margin-bottom: 58px; color: var(--ink); font-family: Georgia, "Times New Roman", serif; font-size: clamp(23px, 2.5vw, 30px); line-height: 1.45; }
.post-body h2 { margin: 82px 0 22px; color: var(--ink); font-size: clamp(34px, 4vw, 46px); font-weight: 400; letter-spacing: -.035em; line-height: 1.08; }
.post-body h3 { margin: 56px 0 15px; color: var(--ink); font-size: 28px; font-weight: 400; letter-spacing: -.025em; }
.post-body hr { margin: 70px 0; border: 0; border-top: 1px solid var(--line); }
.post-wide { width: 100%; margin-right: 0; margin-left: 0; transform: none; }

/* Compact maturity framework */
.framework-widget { margin-top: 42px; margin-bottom: 54px; overflow: hidden; border: 1px solid var(--line-dark); border-radius: 8px; background: #fff; box-shadow: var(--shadow-sm); }
.widget-head { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 18px; color: #fff; background: var(--navy); }
.widget-head div { display: flex; align-items: baseline; gap: 12px; }
.widget-head strong { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.widget-head span { color: rgba(255,255,255,.42); font-size: 9px; }
.widget-head small { color: var(--yellow); font: 600 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .06em; }
.framework-tabs { display: grid; grid-template-columns: repeat(4, 1fr); }
.framework-tab { position: relative; min-height: 72px; padding: 14px 18px; color: #737d8c; text-align: left; border: 0; border-right: 1px solid var(--line); background: #fff; cursor: pointer; }
.framework-tab:last-child { border-right: 0; }
.framework-tab::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: var(--yellow); transform: scaleX(0); transform-origin: left; transition: transform 220ms var(--ease); }
.framework-tab:hover { color: var(--ink); background: #faf9f5; }
.framework-tab.active { color: var(--ink); background: var(--yellow-soft); }
.framework-tab.active::after { transform: scaleX(1); }
.framework-tab span, .framework-tab strong { display: block; }
.framework-tab span { margin-bottom: 4px; color: #9aa2ae; font: 700 8px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.framework-tab strong { font-family: Georgia, "Times New Roman", serif; font-size: 17px; font-weight: 400; }
.framework-progress { height: 2px; background: #eaedf0; }
.framework-progress span { width: 25%; height: 100%; display: block; background: var(--yellow); transition: width 320ms var(--ease); }
.framework-panel { padding: 38px clamp(24px, 5vw, 52px); animation: panelIn 260ms var(--ease) both; }
.framework-panel[hidden] { display: none; }
.stage-heading { display: flex; align-items: center; gap: 18px; }
.stage-heading > span { color: #d9dde2; font: 400 44px/1 Georgia, "Times New Roman", serif; }
.stage-heading small { display: block; margin-bottom: 3px; color: var(--blue); font: 800 8px/1 Inter, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.stage-heading h3 { margin: 0; font-size: clamp(25px, 3vw, 34px); line-height: 1.08; }
.stage-heading h3 em { color: var(--muted); font-size: .58em; font-weight: 400; }
.framework-panel > p { max-width: 760px; margin: 20px 0 0; color: #536072; font-size: 14px; line-height: 1.7; }
.stage-notes { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.stage-notes > div + div { padding-left: 24px; border-left: 1px solid var(--line); }
.stage-notes strong { display: block; color: #7f8997; font-size: 8px; letter-spacing: .13em; text-transform: uppercase; }
.stage-notes p { margin: 7px 0 0; color: #536072; font-size: 11px; line-height: 1.65; }
.framework-widget > figcaption { padding: 11px 18px; color: #8d95a1; font-size: 9px; border-top: 1px solid var(--line); background: #f7f7f5; }
.post-note { margin: 50px 0 70px; padding: 20px 22px; border-left: 3px solid var(--yellow); background: var(--yellow-soft); }
.post-note strong { color: var(--ink); font-family: Georgia, "Times New Roman", serif; font-size: 19px; font-weight: 400; }
.post-note p { margin: 7px 0 0; color: #596474; font-size: 13px; line-height: 1.65; }

/* Process figures */
.process-figure { margin-top: 34px; margin-bottom: 38px; padding: 30px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.figure-scroll { overflow-x: auto; scrollbar-color: #c5cbd2 transparent; }
.shortcut-flow, .reliable-flow { min-width: 760px; display: flex; align-items: center; justify-content: center; }
.terminal { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 48px; border: 2px solid var(--navy); border-radius: 50%; }
.terminal.start i { width: 0; height: 0; margin-left: 3px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid var(--navy); }
.terminal.stop i { width: 15px; height: 15px; background: var(--navy); }
.arrow { position: relative; width: 36px; height: 1px; flex: 0 0 36px; background: #747c87; }
.arrow::after { content: ""; position: absolute; top: -4px; right: 0; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 7px solid #747c87; }
.context-stack { width: 150px; display: grid; flex: 0 0 150px; gap: 5px; }
.context-stack span { min-height: 27px; display: grid; place-items: center; padding: 4px; color: #6d7683; font: 500 8px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; text-align: center; border: 1px solid #c4c9cf; background: #f4f3f0; }
.ai-box { width: 245px; min-height: 126px; display: flex; flex: 0 0 245px; flex-direction: column; align-items: center; justify-content: center; color: #174f83; border: 2px solid #3978b2; background: #e4ecf5; }
.ai-box strong { font: 700 25px/1 Georgia, serif; }
.ai-box span { margin-top: 9px; color: #63809b; font: 500 9px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.process-figure figcaption { margin-top: 22px; color: #647081; font-family: Georgia, "Times New Roman", serif; font-size: 15px; font-style: italic; }
.flow-step { width: 112px; min-height: 78px; display: flex; flex: 0 0 112px; flex-direction: column; align-items: center; justify-content: center; border: 2px solid; }
.flow-step small { font: 700 7px/1 ui-monospace, SFMono-Regular, Menlo, monospace; opacity: .6; }
.flow-step strong { margin-top: 7px; font-family: Georgia, "Times New Roman", serif; font-size: 15px; }
.flow-step.auto { color: #146b57; border-color: #2b927c; background: #e3f0eb; }
.flow-step.ai { color: #164d80; border-color: #3978b2; background: #e4ecf5; }
.flow-step.human { color: #725c0b; border-color: #d1aa0e; background: #fff0b8; }
.figure-legend { display: flex; flex-wrap: wrap; gap: 16px 24px; margin-top: 18px; color: #6f7885; font: 500 8px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.figure-legend span { display: flex; align-items: center; gap: 6px; }
.figure-legend i { width: 10px; height: 10px; border: 2px solid; }
.figure-legend i.ai { border-color: #3978b2; background: #e4ecf5; }
.figure-legend i.auto { border-color: #2b927c; background: #e3f0eb; }
.figure-legend i.human { border-color: #d1aa0e; background: #fff0b8; }
.post-list { margin: 0 0 36px; padding: 0; list-style: none; }
.post-list li { position: relative; padding: 13px 0 13px 24px; }
.post-list li::before { content: ""; position: absolute; top: 23px; left: 3px; width: 5px; height: 5px; border-radius: 50%; background: var(--yellow); }
.post-list strong { color: var(--ink); }
.post-link { margin-top: 38px !important; }
.post-link a { color: var(--ink); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.post-link span { margin-left: 6px; color: var(--yellow); font-size: 15px; }
@keyframes panelIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

@media (max-width: 760px) {
  .post-main { padding: 0 20px; }
  .post-header { padding-top: 62px; padding-bottom: 44px; }
  .post-header h1 { font-size: clamp(48px, 14vw, 68px); }
  .post-body { padding-top: 48px; font-size: 15px; }
  .post-body h2 { margin-top: 66px; }
  .post-wide { width: 100%; }
  .framework-widget { margin-top: 34px; }
  .widget-head span { display: none; }
  .framework-tabs { grid-template-columns: 1fr 1fr; }
  .framework-tab { min-height: 62px; padding: 11px 14px; }
  .framework-tab:nth-child(2) { border-right: 0; }
  .framework-tab:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .stage-notes { grid-template-columns: 1fr; gap: 18px; }
  .stage-notes > div + div { padding: 18px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .framework-panel { padding: 28px 20px; }
  .stage-heading > span { display: none; }
  .process-figure { padding: 22px 16px; }
}
