/* Homepage concept: problem first, governed intelligence second. */
.concept-display {
  margin: 0;
  font-family: 'Inter', -apple-system, Helvetica, sans-serif;
  font-size: clamp(42px, 5.25vw, 76px);
  font-weight: 650;
  line-height: .92;
  letter-spacing: -.06em;
}

.concept-hero {
  padding: clamp(78px, 9vw, 132px) 0 clamp(66px, 8vw, 112px);
  border-bottom: 1px solid var(--ink);
  background: var(--paper);
  overflow: hidden;
}
.concept-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.38fr) minmax(320px, .62fr);
  gap: clamp(46px, 7vw, 104px);
  align-items: end;
}
.concept-hero-title h1 {
  max-width: 11ch;
  margin: 28px 0 0;
  font-family: 'Inter', -apple-system, Helvetica, sans-serif;
  font-size: clamp(66px, 8.2vw, 118px);
  font-weight: 650;
  line-height: .86;
  letter-spacing: -.072em;
}
.concept-hero-title h1 span { color: var(--accent); }
.concept-hero-copy { padding-bottom: 5px; }
.concept-hero-copy p { margin: 0; }
.concept-problem {
  color: var(--ink);
  font-size: clamp(18px, 1.65vw, 24px);
  line-height: 1.42;
  letter-spacing: -.022em;
}
.concept-answer {
  margin-top: 24px !important;
  padding-top: 24px;
  border-top: 1px solid var(--ink);
  color: var(--mute-2);
  font-size: 15px;
  line-height: 1.62;
}
.concept-hero-actions {
  margin-top: 34px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}
.concept-schedule {
  color: var(--ink);
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 7px;
}
.concept-schedule span { color: var(--accent); }

.concept-path { padding: clamp(76px, 9vw, 126px) 0; background: var(--paper-2); }
.concept-section-head {
  margin-bottom: clamp(48px, 6vw, 82px);
  display: grid;
  grid-template-columns: minmax(170px, .34fr) minmax(0, 1fr);
  gap: clamp(42px, 7vw, 108px);
  align-items: start;
}
.concept-section-head > div:last-child { max-width: 930px; }
.concept-section-head p {
  max-width: 58ch;
  margin: 26px 0 0;
  color: var(--mute-2);
  font-size: 16px;
  line-height: 1.6;
}
.concept-corridor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1.15fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr);
  align-items: stretch;
}
.concept-corridor-state {
  min-width: 0;
  min-height: 266px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--ink);
  background: var(--paper);
}
.concept-corridor-state .state-meta { display: flex; justify-content: space-between; gap: 12px; }
.concept-corridor-state .state-meta span,
.concept-corridor-state .state-meta small {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.concept-corridor-state .state-meta span { color: var(--accent-ink); }
.concept-corridor-state .state-meta small { color: var(--mute); }
.concept-corridor-state h3 {
  margin: 62px 0 0;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(25px, 2.35vw, 35px);
  font-weight: 400;
  line-height: 1;
}
.concept-corridor-state p { margin: auto 0 0; color: var(--mute); font-size: 10px; line-height: 1.5; }
.concept-corridor-state.model { border-top: 4px solid var(--accent); }
.concept-corridor-state.intelligence { color: var(--paper); background: var(--ink); box-shadow: 8px 8px 0 color-mix(in srgb, var(--papaya) 20%, transparent); }
.concept-corridor-state.intelligence .state-meta span { color: var(--papaya); }
.concept-corridor-state.intelligence .state-meta small,
.concept-corridor-state.intelligence p { color: color-mix(in srgb, var(--paper) 62%, transparent); }
.concept-corridor-state.review { background: var(--accent-wash); box-shadow: inset 0 4px 0 var(--papaya); }
.concept-corridor-arrow { position: relative; align-self: center; height: 1px; background: var(--accent); }
.concept-corridor-arrow::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 1px solid var(--accent); border-right: 1px solid var(--accent); transform: rotate(45deg); }
.concept-context-rail {
  margin-top: 18px;
  min-height: 62px;
  padding: 12px 18px;
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  color: var(--paper);
  background: var(--ink);
}
.concept-context-rail > span { color: var(--papaya); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.concept-context-rail > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.concept-context-rail b { font-size: 9px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.concept-context-rail i { flex: 1; height: 1px; background: var(--papaya); }

.concept-fabric { padding: clamp(80px, 9vw, 128px) 0; color: var(--paper); background: var(--ink); }
.concept-section-head.light h2 { color: var(--paper); }
.concept-section-head.light p { color: color-mix(in srgb, var(--paper) 64%, transparent); }
.fabric-visual { border: 1px solid color-mix(in srgb, var(--paper) 32%, transparent); }
.fabric-surfaces { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fabric-surfaces > div {
  min-height: 162px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid color-mix(in srgb, var(--paper) 22%, transparent);
}
.fabric-surfaces > div:last-child { border-right: 0; }
.fabric-surfaces span,
.fabric-outcomes span { color: var(--papaya); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.fabric-surfaces strong { margin-top: 34px; color: var(--paper); font-family: 'Instrument Serif', Georgia, serif; font-size: 28px; font-weight: 400; }
.fabric-surfaces small { margin-top: auto; color: color-mix(in srgb, var(--paper) 53%, transparent); font-size: 10px; line-height: 1.4; }
.fabric-core { border-top: 1px solid color-mix(in srgb, var(--paper) 32%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--paper) 32%, transparent); }
.fabric-core-label {
  padding: 18px 20px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  color: var(--ink);
  background: var(--papaya);
}
.fabric-core-label span { font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.fabric-core-label strong { font-size: 12px; }
.fabric-core-rail { padding: 18px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.fabric-core-rail span { min-height: 66px; padding: 12px; display: flex; align-items: center; justify-content: center; border: 1px solid color-mix(in srgb, var(--paper) 28%, transparent); color: var(--paper); font-size: 10px; line-height: 1.35; text-align: center; }
.fabric-core-rail span.active { color: var(--ink); background: var(--paper); border-color: var(--paper); }
.fabric-outcomes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fabric-outcomes > div { min-height: 130px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid color-mix(in srgb, var(--paper) 22%, transparent); }
.fabric-outcomes > div:last-child { border-right: 0; }
.fabric-outcomes strong { color: var(--paper); font-size: 14px; font-weight: 600; }
.fabric-boundary { margin: 22px 0 0; color: color-mix(in srgb, var(--paper) 68%, transparent); font-size: 12px; text-align: right; }

.concept-composer { padding-top: clamp(82px, 10vw, 136px); }
.concept-composer-proof { box-shadow: 12px 12px 0 color-mix(in srgb, var(--papaya) 20%, transparent); }

.concept-workflows { padding-top: clamp(82px, 10vw, 136px); }
.concept-workflow-grid { display: grid; grid-template-columns: 1.25fr .875fr .875fr; border: 1px solid var(--ink); }
.concept-workflow-card {
  min-width: 0;
  min-height: 420px;
  padding: clamp(24px, 3vw, 38px);
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--ink);
  color: var(--ink);
  background: var(--paper);
  text-decoration: none;
}
.concept-workflow-card:last-child { border-right: 0; }
.concept-workflow-card:hover { background: var(--accent-wash); }
.concept-workflow-card.featured { color: var(--paper); background: var(--ink); box-shadow: inset 0 4px 0 var(--papaya); }
.concept-workflow-card > span { color: var(--accent-ink); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.concept-workflow-card.featured > span { color: var(--papaya); }
.concept-workflow-card h3 { margin: 70px 0 20px; font-family: 'Instrument Serif', Georgia, serif; font-size: clamp(31px, 3.1vw, 44px); font-weight: 400; line-height: 1; letter-spacing: -.025em; }
.concept-workflow-card p { margin: 0; color: var(--mute-2); font-size: 14px; line-height: 1.58; }
.concept-workflow-card.featured p { color: color-mix(in srgb, var(--paper) 66%, transparent); }
.concept-workflow-card > strong { margin-top: auto; padding-top: 34px; font-size: 12px; }
.concept-workflow-card > strong i { margin-left: 8px; color: var(--papaya); font-style: normal; }
.concept-production-note {
  margin: 18px 0 0;
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--ink) 28%, transparent);
  color: var(--mute);
  font-size: 12px;
  line-height: 1.5;
}

.concept-boundary { padding: clamp(82px, 9vw, 124px) 0; }
.concept-boundary-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(48px, 8vw, 120px); align-items: start; }
.concept-boundary .concept-display { margin-top: 32px; font-size: clamp(42px, 4.8vw, 68px); }
.concept-boundary-lines { border-top: 1px solid var(--ink); }
.concept-boundary-lines > div { min-height: 176px; padding: 24px 0; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; align-items: center; border-bottom: 1px solid var(--ink); }
.concept-boundary-lines span { color: var(--accent-ink); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.concept-boundary-lines strong { font-family: 'Instrument Serif', Georgia, serif; font-size: 28px; font-weight: 400; line-height: 1.15; }

.concept-closing { background: var(--accent-wash); }
.concept-closing-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(48px, 8vw, 112px); align-items: end; }
.concept-closing .concept-display { margin-top: 30px; }
.concept-closing p { margin: 0; color: var(--mute-2); font-size: 16px; line-height: 1.6; }
.concept-closing .concept-signoff { grid-column: 1 / -1; margin-top: 76px; padding-top: 18px; border-top: 1px solid var(--ink); color: var(--ink); font-family: 'Instrument Serif', Georgia, serif; font-size: clamp(30px, 3.5vw, 48px); }

@media (max-width: 980px) {
  .concept-hero-grid,
  .concept-section-head,
  .concept-boundary-grid,
  .concept-closing-grid { grid-template-columns: minmax(0, 1fr); }
  .concept-hero-copy { max-width: 720px; }
  .concept-section-head { gap: 34px; }
  .concept-section-head > div:last-child { max-width: 800px; }
  .concept-corridor { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .concept-corridor-arrow { display: none; }
  .concept-corridor-state { min-height: 286px; border-right: 0; }
  .concept-corridor-state:last-child { border-right: 1px solid var(--ink); }
  .concept-corridor-state h3 { font-size: 23px; overflow-wrap: anywhere; }
  .concept-context-rail { min-width: 0; overflow: hidden; }
  .concept-context-rail > div { min-width: 0; overflow-x: auto; }
  .concept-workflow-grid { grid-template-columns: 1fr 1fr; }
  .concept-workflow-card.featured { grid-column: 1 / -1; }
  .concept-workflow-card:nth-child(2) { border-top: 1px solid var(--ink); }
  .concept-workflow-card:nth-child(3) { border-top: 1px solid var(--ink); border-right: 0; }
}

@media (max-width: 720px) {
  .concept-display { font-size: clamp(40px, 12vw, 58px); line-height: .94; overflow-wrap: anywhere; }
  .concept-hero { padding: 58px 0 70px; }
  .concept-hero-grid { gap: 34px; }
  .concept-hero-title h1 { max-width: none; margin-top: 20px; font-size: clamp(50px, 14vw, 64px); line-height: .88; overflow-wrap: normal; }
  .concept-problem { font-size: 16px; line-height: 1.43; }
  .concept-answer { margin-top: 18px !important; padding-top: 18px; font-size: 13px; line-height: 1.5; }
  .concept-hero-actions { margin-top: 24px; gap: 16px; }
  .concept-path,
  .concept-fabric { padding: 74px 0; }
  .concept-section-head { margin-bottom: 42px; gap: 24px; }
  .concept-section-head p { margin-top: 20px; font-size: 14px; }
  .concept-corridor { grid-template-columns: minmax(0, 1fr); }
  .concept-corridor-state {
    min-height: 112px;
    padding: 15px 16px;
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    border-right: 1px solid var(--ink);
    border-bottom: 0;
  }
  .concept-corridor-state:last-child { border-bottom: 1px solid var(--ink); }
  .concept-corridor-state .state-meta { grid-row: 1 / 3; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
  .concept-corridor-state .state-meta span,
  .concept-corridor-state .state-meta small,
  .concept-corridor-state p,
  .concept-context-rail > span,
  .concept-context-rail b,
  .fabric-surfaces span,
  .fabric-surfaces small,
  .fabric-core-label span,
  .fabric-core-rail span,
  .fabric-outcomes span,
  .concept-workflow-card > span,
  .concept-boundary-lines span {
    font-size: 11px;
  }
  .concept-corridor-state h3 { margin: 0; font-size: 27px; }
  .concept-corridor-state p { margin: 7px 0 0; }
  .concept-corridor-state.intelligence { box-shadow: 6px 6px 0 color-mix(in srgb, var(--papaya) 20%, transparent); }
  .concept-context-rail { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .concept-context-rail > div { justify-content: flex-start; overflow-x: auto; }
  .concept-context-rail i { flex: 0 0 18px; }
  .fabric-surfaces { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fabric-surfaces > div { min-height: 148px; border-bottom: 1px solid color-mix(in srgb, var(--paper) 22%, transparent); }
  .fabric-surfaces > div:nth-child(2n) { border-right: 0; }
  .fabric-core-label { flex-direction: column; gap: 5px; }
  .fabric-core-rail { grid-template-columns: minmax(0, 1fr); }
  .fabric-core-rail span { min-height: 48px; }
  .fabric-outcomes { grid-template-columns: minmax(0, 1fr); }
  .fabric-outcomes > div { min-height: 98px; border-right: 0; border-bottom: 1px solid color-mix(in srgb, var(--paper) 22%, transparent); }
  .fabric-outcomes > div:last-child { border-bottom: 0; }
  .fabric-boundary { text-align: left; line-height: 1.5; }
  .concept-composer-proof { margin-inline: -12px; box-shadow: 7px 7px 0 color-mix(in srgb, var(--papaya) 20%, transparent); }
  .concept-composer-proof .composer-proof-media { height: 390px; overflow: hidden; }
  .concept-composer-proof .composer-proof-media img { width: auto; max-width: none; height: 100%; transform: translateX(-23%); }
  .concept-workflow-grid { grid-template-columns: minmax(0, 1fr); }
  .concept-workflow-card,
  .concept-workflow-card.featured { min-height: 340px; grid-column: auto; border-right: 0; border-bottom: 1px solid var(--ink); }
  .concept-workflow-card:last-child { border-bottom: 0; }
  .concept-workflow-card h3 { margin-top: 48px; }
  .concept-boundary .concept-display { font-size: clamp(40px, 11vw, 54px); }
  .concept-boundary-lines > div { min-height: 0; grid-template-columns: minmax(0, 1fr); gap: 15px; }
  .concept-boundary-lines strong { font-size: 25px; }
  .concept-closing-grid { gap: 38px; }
  .concept-closing .concept-signoff { margin-top: 40px; font-size: 32px; }
}

@media (prefers-reduced-motion: reduce) {
  .concept-workflow-card { scroll-behavior: auto; }
}
