.supplier-project-hero { padding-top: 4rem; padding-bottom: 2.8rem; }
.supplier-project-hero h1 { max-width: 1050px; margin-bottom: 2.2rem; font-size: clamp(3rem,5.2vw,5.2rem); }
.supplier-project-hero .project-summary { max-width: 830px; font-size: 1.06rem; }
.supplier-project-layout { align-items: start; }
.supplier-sticky { position: sticky; top: 105px; }
.supplier-project-layout .project-section > p:not(.section-label) { max-width: 800px; color: var(--ink-700); }
.logic-steps { margin: 2rem 0; display: grid; grid-template-columns: repeat(6, 1fr); border-block: 1px solid var(--line); }
.logic-steps > div { min-height: 112px; padding: 1rem; display: flex; flex-direction: column; border-right: 1px solid var(--line); }
.logic-steps > div:nth-child(3) { background: rgba(184,220,255,.34); }
.logic-steps > div:last-child { border-right: 0; background: linear-gradient(120deg, rgba(184,220,255,.72), transparent); }
.logic-steps span { margin-bottom: auto; color: var(--ink-500); font-family: var(--font-mono); font-size: .64rem; }
.logic-steps strong { font-family: var(--font-display); font-size: 1.15rem; font-weight: 500; }
.logic-steps small { margin-top: .2rem; color: var(--ink-500); font-size: .7rem; }
.method-callout { padding: 2.1rem 2.1rem 2.3rem; border-left: 5px solid var(--accent-strong); background: var(--paper-tint); }
.method-callout h2 { max-width: 720px; }
.method-grid { margin-top: 1.8rem; display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--line); }
.method-grid > div { min-height: 170px; padding: 1.2rem; border-right: 1px solid var(--line); }
.method-grid > div:last-child { border-right: 0; }
.method-grid span { display: block; color: var(--ink-500); font-family: var(--font-mono); font-size: .64rem; text-transform: uppercase; }
.method-grid strong { display: block; margin-top: 1.7rem; font-family: var(--font-display); font-size: 1.5rem; font-weight: 500; }
.method-grid p { margin: .6rem 0 0; color: var(--ink-700); font-size: .82rem; }
.case-demo-preview { min-height: 320px; display: grid; grid-template-columns: minmax(390px,.58fr) minmax(300px,.42fr); border: 1px solid var(--line); border-top-color: var(--ink); background: #fff; }
.mini-calibration { padding: 1.35rem; border-right: 1px solid var(--line); background: var(--paper); }
.mini-title { min-height: 46px; display: flex; align-items: flex-start; justify-content: space-between; border-bottom: 1px solid var(--line); }
.mini-title span { font-family: var(--font-display); font-size: 1.35rem; }
.mini-title b { padding: .35rem .5rem; background: var(--accent); font-family: var(--font-mono); font-size: .55rem; font-weight: 400; text-transform: uppercase; }
.mini-calibration-head, .mini-calibration > div:not(.mini-title):not(.mini-calibration-head) { display: grid; grid-template-columns: 1fr 50px 90px 58px; gap: .55rem; align-items: center; }
.mini-calibration-head { min-height: 30px; color: var(--ink-500); font-family: var(--font-mono); font-size: .5rem; text-transform: uppercase; }
.mini-calibration > div:not(.mini-title):not(.mini-calibration-head) { min-height: 43px; border-top: 1px solid var(--line); }
.mini-calibration strong { font-family: var(--font-display); font-size: .85rem; font-weight: 500; }
.mini-calibration > div > span, .mini-calibration em { font-family: var(--font-mono); font-size: .56rem; font-style: normal; }
.mini-calibration i { height: 5px; display: block; background: #e5e5df; }
.mini-calibration i b { height: 100%; display: block; background: var(--accent-strong); }
.mini-output { padding: 1.4rem; }
.mini-metrics { display: grid; grid-template-columns: repeat(3,1fr); border-block: 1px solid var(--line); }
.mini-metrics > span { padding: .8rem; border-right: 1px solid var(--line); font-family: var(--font-display); font-size: 1.15rem; }
.mini-metrics > span:last-child { border-right: 0; }
.mini-metrics small { display: block; margin-top: .2rem; color: var(--ink-500); font-family: var(--font-mono); font-size: .55rem; text-transform: uppercase; }
.mini-best { background: linear-gradient(90deg, rgba(184,220,255,.7), transparent); }
.mini-rank { min-height: 65px; display: grid; grid-template-columns: 32px 1fr 55px; gap: .8rem; align-items: center; border-bottom: 1px solid var(--line); }
.mini-rank:first-of-type { background: linear-gradient(90deg, rgba(184,220,255,.65), transparent); }
.mini-rank b { color: var(--ink-500); font-family: var(--font-mono); font-size: .62rem; font-weight: 400; }
.mini-rank strong { font-family: var(--font-display); font-size: 1.05rem; font-weight: 500; }
.mini-rank em { font-family: var(--font-display); font-size: 1.15rem; font-style: normal; text-align: right; }
.demo-caption { margin: 1.3rem 0; }
.privacy-note { margin-top: 1rem; padding: 1.5rem; display: grid; grid-template-columns: 150px 1fr; gap: 2rem; border-block: 1px solid var(--line); background: linear-gradient(90deg, rgba(184,220,255,.45), transparent); }
.privacy-note span { font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase; }
.privacy-note p { margin: 0; color: var(--ink-700); }

@media (max-width: 1050px) {
  .supplier-sticky { position: static; }
  .logic-steps { grid-template-columns: repeat(3, 1fr); }
  .logic-steps > div { border-bottom: 1px solid var(--line); }
  .case-demo-preview { grid-template-columns: 1fr; }
  .mini-calibration { border-right: 0; border-bottom: 1px solid var(--line); }
}

@media (max-width: 700px) {
  .method-grid { grid-template-columns: 1fr; }
  .method-grid > div { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .method-grid > div:last-child { border-bottom: 0; }
  .method-grid strong { margin-top: 1rem; }
  .logic-steps { grid-template-columns: repeat(2, 1fr); }
  .mini-calibration { padding-inline: .9rem; overflow-x: auto; }
  .mini-calibration-head, .mini-calibration > div:not(.mini-title):not(.mini-calibration-head) { min-width: 440px; }
}

@media (max-width: 600px) {
  .supplier-project-hero { padding-top: 3rem; padding-bottom: 2rem; }
  .supplier-project-hero h1 { margin-bottom: 1.5rem; font-size: clamp(2.7rem,13vw,4rem); }
  .supplier-project-layout { padding-top: 3rem; }
  .logic-steps { grid-template-columns: 1fr; }
  .logic-steps > div { min-height: 90px; border-right: 0; }
  .method-callout { padding: 1.4rem; }
  .privacy-note { grid-template-columns: 1fr; gap: .7rem; }
  .mini-metrics { grid-template-columns: 1fr; }
  .mini-metrics > span { border-right: 0; border-bottom: 1px solid var(--line); }
  .mini-rank { grid-template-columns: 25px 1fr 44px; }
}
