:root { --vanta: #000100; --breakwater-red: #F0443E; }

.concept-bar { min-height: 34px; display: flex; align-items: center; justify-content: center; gap: 28px; padding: 7px 20px; background: var(--vanta); color: #FFFFFF; font: 10px/1.4 monospace; letter-spacing: .08em; text-transform: uppercase; }
.concept-bar a { color: #FFFFFF; text-underline-offset: 4px; }

.concept-difference { padding-block: 92px 100px; background: var(--vanta); color: #F7F7F5; }
.concept-difference-heading { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 70px; align-items: start; margin-bottom: 48px; }
.concept-difference-heading .eyebrow { color: #B8B8B3; }
.concept-difference-heading h2 { max-width: 15ch; font-size: clamp(38px,4.1vw,60px); line-height: 1.02; }
.concept-difference-heading > div:last-child { padding-top: 30px; }
.concept-difference-heading p { max-width: 58ch; color: #B8B8B3; }
.concept-difference-heading .concept-question { margin-bottom: 14px; color: #FFFFFF; font-size: 20px; font-weight: 650; }

.concept-decision-chain { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 34px; border: 1px solid #18181B; border-top: 3px solid var(--breakwater-red); }
.concept-decision-chain > div { position: relative; min-height: 142px; padding: 21px; border-right: 1px solid #18181B; }
.concept-decision-chain > div:last-child { border-right: 0; }
.concept-decision-chain > div:not(:last-child)::after { content: "→"; position: absolute; z-index: 2; top: 24px; right: -12px; width: 24px; color: var(--breakwater-red); text-align: center; background: var(--vanta); }
.concept-decision-chain span, .concept-decision-chain strong, .concept-decision-chain small { display: block; }
.concept-decision-chain span { color: #74746F; font: 11px/1.4 monospace; }
.concept-decision-chain strong { margin-top: 26px; color: #FFFFFF; font-size: 18px; }
.concept-decision-chain small { margin-top: 7px; color: #AAA9A5; font-size: 12px; line-height: 1.5; }

.concept-product-visual { margin-block: 34px; }
.discover-concept-visual { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1px; overflow: hidden; border: 1px solid #18181B; border-radius: 8px; background: #18181B; }
.concept-product-visual figure { min-width: 0; margin: 0; background: #0A0A0B; }
.concept-product-visual img { width: 100%; height: 330px; object-fit: cover; object-position: center; }
.concept-product-visual figcaption { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 18px; padding: 16px 18px; border-top: 1px solid #18181B; }
.concept-product-visual strong { color: #FFFFFF; font-size: 13px; }
.concept-product-visual span { color: #AAA9A5; font-size: 12px; }

.concept-evidence-record { display: grid; grid-template-columns: minmax(0,1fr) 36px minmax(0,1fr) 36px minmax(0,1fr); align-items: stretch; margin-block: 34px; }
.concept-evidence-record > div { min-width: 0; padding: 28px 24px; border: 1px solid #18181B; border-top: 3px solid var(--breakwater-red); border-radius: 6px; background: #0A0A0B; }
.concept-evidence-record > b { align-self: center; color: var(--breakwater-red); text-align: center; }
.concept-evidence-record span, .concept-evidence-record strong, .concept-evidence-record small { display: block; }
.concept-evidence-record span { color: #74746F; font: 10px/1.4 monospace; }
.concept-evidence-record strong { margin-top: 28px; color: #FFFFFF; font-size: 19px; }
.concept-evidence-record small { margin-top: 8px; color: #AAA9A5; line-height: 1.5; }

.concept-control-loop { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-block: 34px; border: 1px solid #18181B; border-radius: 8px; overflow: hidden; }
.concept-control-loop > div { min-height: 150px; padding: 26px; background: #0A0A0B; }
.concept-control-loop > div + div { border-left: 1px solid #18181B; }
.concept-control-loop span, .concept-control-loop strong { display: block; }
.concept-control-loop span { color: var(--breakwater-red); font: 11px/1.4 monospace; letter-spacing: .08em; text-transform: uppercase; }
.concept-control-loop strong { max-width: 12ch; margin-top: 32px; color: #FFFFFF; font-size: 23px; }
.concept-control-loop p { grid-column: 1 / -1; margin: 0; padding: 18px 26px; border-top: 1px solid #18181B; color: #E6E6E2; text-align: center; }

.concept-proof-wide { margin-top: 34px; }
.concept-proof-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-top: 34px; overflow: hidden; border: 1px solid #18181B; border-radius: 8px; background: #18181B; }
.concept-proof-media { min-width: 0; margin-bottom: 0; overflow: hidden; border: 1px solid #18181B; border-radius: 8px; background: #0A0A0B; }
.concept-proof-pair .concept-proof-media { border: 0; border-radius: 0; }
.concept-proof-media img { display: block; width: 100%; height: auto; }
.concept-proof-pair .concept-proof-media img { aspect-ratio: 1.72 / 1; object-fit: cover; object-position: center; }
.concept-proof-media figcaption { display: grid; grid-template-columns: minmax(180px,.7fr) minmax(0,1.3fr); gap: 22px; padding: 17px 19px; border-top: 1px solid #18181B; }
.concept-proof-media strong { color: #FFFFFF; font-size: 13px; }
.concept-proof-media span { color: #AAA9A5; font-size: 12px; line-height: 1.5; }
.concept-provenance-hero img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.provenance-inventory-proof { margin: 0 0 34px; }
.provenance-inventory-proof .capture-window { aspect-ratio: 2.59 / 1; background: #0A0A0B; }
.provenance-inventory-proof .capture-window img { display: block; width: 100%; height: 100%; object-fit: contain; }
.discover-ai-access { display: grid; grid-template-columns: minmax(280px,.62fr) minmax(0,1.38fr); gap: 42px; align-items: center; margin: 0 0 38px; padding: 32px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.discover-ai-access h3 { max-width: 13ch; font-size: clamp(28px,3vw,40px); }
.discover-ai-access > div > p { color: var(--muted); }
.discover-ai-access .evidence-list { margin-bottom: 0; }
.discover-ai-access .product-frame { min-width: 0; margin: 0; }
.discover-ai-access .capture-window { aspect-ratio: 4.16 / 1; background: #0A0A0B; }
.discover-ai-access .capture-window img { display: block; width: 100%; height: 100%; object-fit: contain; }
.concept-workflow-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.concept-workflow-grid article { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.concept-workflow-image { aspect-ratio: 16 / 10.2; overflow: hidden; background: #0A0A0B; }
.concept-workflow-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.concept-workflow-copy { padding: 22px; }
.concept-workflow-copy > span { display: block; margin-bottom: 16px; color: var(--muted); font: 10px/1.4 monospace; letter-spacing: .08em; }
.concept-workflow-copy h3 { min-height: 2.4em; font-size: 22px; }
.concept-workflow-copy p { min-height: 6.4em; color: var(--muted); font-size: 13px; }
.concept-workflow-copy button { min-height: 40px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 4px; background: transparent; color: var(--ink); font: inherit; font-size: 12px; font-weight: 600; line-height: 1.3; cursor: pointer; }
.concept-workflow-copy button:hover { border-color: var(--breakwater-red); }
.concept-workflow-link { margin: 24px 0 0; text-align: right; }

.concept-comparison { margin-top: 34px; border: 1px solid #18181B; border-radius: 8px; overflow: hidden; }
.concept-comparison > div { display: grid; grid-template-columns: .9fr 1fr 1.18fr 1.12fr; }
.concept-comparison > div + div { border-top: 1px solid #18181B; }
.concept-comparison span { min-width: 0; padding: 17px 18px; color: #B8B8B3; font-size: 13px; line-height: 1.55; }
.concept-comparison span + span { border-left: 1px solid #18181B; }
.concept-comparison > div:not(.concept-comparison-head) span:first-child { color: #FFFFFF; font-weight: 650; }
.concept-comparison > div:not(.concept-comparison-head) span:nth-child(3) { color: #FFFFFF; }
.concept-comparison-head { background: #121214; }
.concept-comparison-head span { color: #8D8C87; font: 10px/1.4 monospace; letter-spacing: .08em; text-transform: uppercase; }

@media (max-width: 820px) {
  .concept-difference { padding-block: 68px 74px; }
  .concept-difference-heading { grid-template-columns: 1fr; gap: 15px; }
  .concept-difference-heading > div:last-child { padding-top: 0; }
  .discover-concept-visual { grid-template-columns: 1fr; }
  .concept-product-visual img { height: auto; }
  .concept-evidence-record { grid-template-columns: 1fr; gap: 0; }
  .concept-evidence-record > b { padding: 8px; transform: rotate(90deg); }
  .concept-control-loop { grid-template-columns: 1fr; }
  .concept-control-loop > div + div { border-left: 0; border-top: 1px solid #18181B; }
  .concept-proof-pair { grid-template-columns: 1fr; }
  .discover-ai-access { grid-template-columns: 1fr; padding: 24px; }
  .concept-workflow-grid { grid-template-columns: 1fr; }
  .concept-workflow-grid article { display: grid; grid-template-columns: minmax(260px,.95fr) minmax(0,1.05fr); }
  .concept-workflow-copy h3, .concept-workflow-copy p { min-height: 0; }
  .concept-comparison { overflow-x: auto; }
  .concept-comparison > div { min-width: 780px; }
}

@media (max-width: 560px) {
  .concept-bar { justify-content: flex-end; font-size: 9px; }
  .concept-bar > span { display: none; }
  .concept-decision-chain { grid-template-columns: 1fr; }
  .concept-decision-chain > div { min-height: 105px; border-right: 0; border-bottom: 1px solid #18181B; }
  .concept-decision-chain > div:last-child { border-bottom: 0; }
  .concept-decision-chain > div:not(:last-child)::after { content: "↓"; top: auto; right: 20px; bottom: -12px; }
  .concept-decision-chain strong { margin-top: 13px; }
  .concept-product-visual figcaption { grid-template-columns: 1fr; gap: 4px; }
  .concept-proof-media figcaption { grid-template-columns: 1fr; gap: 5px; }
  .concept-workflow-grid article { grid-template-columns: 1fr; }
  .concept-workflow-link { text-align: left; }
}