/* Market-page composition; shared container and display scale live in site-display.css. */
body[data-page="supply-chain-security"] { --ground: #000; --dim: #96a4a7; --rule: #253136; }
.market-hero { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); align-items: center; gap: 4rem; padding-block: 4.5rem; }
.market-back { display: inline-block; margin-bottom: 2rem; font-size: .75rem; color: var(--dim); }
.market-hero .eyebrow, .market-section .eyebrow { color: var(--cyan); font: .7rem/1.5 var(--mono); letter-spacing: .04em; margin-bottom: 1rem; }
.market-hero .eyebrow::before, .market-section .eyebrow::before { display: none; }
.market-hero h1 { max-width: 17ch; }
.market-lede { margin-top: 1.5rem; max-width: 52ch; font-size: 1.05rem; line-height: 1.75; }
.market-hero .ctas, .market-close .ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1.75rem; }
.market-note { font-size: .78rem; color: var(--dim); margin-top: 1.5rem; line-height: 1.7; max-width: 90ch; }
/* Real video crops retain their aspect ratio and open at full resolution. */
.market-captures { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 2rem; align-items: start; margin-top: 3rem; }
.market-capture { min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--rule); border-radius: .5rem; background: #050809; }
.market-capture > a { display: block; }
.market-capture img { display: block; width: 100%; height: auto; }
.market-capture figcaption { padding: 1rem 1.25rem; border-top: 1px solid var(--rule); color: var(--dim); font-size: .75rem; line-height: 1.65; }
.market-capture figcaption a { white-space: nowrap; }
.market-section { padding-block: 4rem; }
.market-section h2 { font: 600 clamp(1.7rem,2.5vw,2.4rem)/1.2 var(--sans); letter-spacing: -.035em; max-width: 27ch; margin-bottom: 1.5rem; color: var(--white); }
.market-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; }
.market-intro > div > p:not(.eyebrow), .market-proof p { margin-bottom: 1.25rem; max-width: 60ch; }
.market-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2rem; margin-top: 2.5rem; }
.market-grid article { border-top: 1px solid var(--rule); padding-top: 1.25rem; }
.market-grid .market-number { display: block; color: var(--cyan); font: .7rem/1.5 var(--mono); margin-bottom: 1rem; }
.market-grid h3 { font: 600 1.1rem/1.4 var(--sans); color: var(--white); margin-bottom: .75rem; }
.market-grid p { font-size: .92rem; color: var(--dim); line-height: 1.75; }
.market-tint { background: #050809; }
.market-proof { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 3rem; align-items: center; }
.market-proof figure { min-width: 0; border: 1px solid var(--rule); border-radius: .375rem; overflow: hidden; }
.market-proof img { width: 100%; height: auto; }
.market-proof figcaption { font-size: .75rem; color: var(--dim); padding: .9rem 1rem; border-top: 1px solid var(--rule); }
.market-links { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; font-size: .85rem; }
.market-faq details { border-top: 1px solid var(--rule); }
.market-faq details:last-child { border-bottom: 1px solid var(--rule); }
.market-faq summary { padding: 1.1rem 0; cursor: pointer; color: var(--white); font-size: .95rem; }
.market-faq details p { padding-bottom: 1.25rem; font-size: .9rem; line-height: 1.75; color: var(--dim); }
.market-close .wrap { padding-top: 3rem; border-top: 1px solid var(--rule); }
.market-close p { max-width: 60ch; }
@supports (grid-template-rows: subgrid) {
  .market-grid[data-align-rows="3"] > article { display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 0; align-items: start; min-width: 0; }
}
@media (max-width: 1050px) {
  .market-hero, .market-intro { gap: 2rem; }
  .market-proof { grid-template-columns: 1fr; gap: 2rem; }
  .market-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 800px) {
  .market-hero, .market-intro, .market-captures { grid-template-columns: 1fr; }
  .market-hero { padding-block: 2.5rem; }
  .market-hero h1 { max-width: 19ch; }
  .market-section { padding-block: 2.75rem; }
  .market-intro { gap: .75rem; }
  .market-captures { gap: 1.5rem; margin-top: 2rem; }
}
@media (max-width: 600px) {
  .market-grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .market-grid[data-align-rows="3"] > article { grid-row: auto; display: block; }
}
