.how-work{max-width:1240px;margin:auto;padding:110px 30px;scroll-margin-top:76px}.how-heading{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:70px;align-items:end;padding-bottom:38px}.how-heading h2{font-size:clamp(42px,5.5vw,72px);line-height:.96;letter-spacing:-.065em;font-weight:520;margin:12px 0 0}.how-heading>p{max-width:530px;color:var(--muted);font-size:15px;line-height:1.7}.how-role-tabs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:18px 18px 0 0;overflow:hidden;background:var(--surface-2)}.how-role-tabs button{position:relative;display:grid;grid-template-columns:42px 1fr;gap:3px 10px;min-height:94px;padding:20px 23px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--ink);text-align:left;font:inherit;cursor:pointer}.how-role-tabs button:last-child{border-right:0}.how-role-tabs button.active{background:var(--surface)}.how-role-tabs button.active:after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:4px;border-radius:4px 4px 0 0;background:var(--coral)}.how-role-tabs button>span{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--butter);color:#3b2a24;font-size:10px;font-weight:900}.how-role-tabs b{font-size:15px}.how-role-tabs small{color:var(--muted);font-size:10px}.how-role-panel{padding:42px;border:1px solid var(--line);border-top:0;border-radius:0 0 24px 24px;background:var(--surface);box-shadow:var(--shadow)}.how-role-panel[hidden]{display:none}.how-role-panel.active{animation:howPanelIn .3s ease both}.how-role-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:end;margin-bottom:32px}.how-role-intro h3{max-width:690px;font-size:clamp(30px,4vw,48px);line-height:1.03;letter-spacing:-.055em;font-weight:550;margin:9px 0 0}.how-role-intro>p{color:var(--muted);font-size:13px;line-height:1.65}.how-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-left:1px solid var(--line);border-top:1px solid var(--line)}.how-steps article{position:relative;min-height:265px;padding:23px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface);transition:background .2s,transform .2s}.how-steps article:hover{z-index:1;background:var(--surface-2);transform:translateY(-3px)}.how-steps article>span{color:var(--coral);font-size:9px;font-weight:900;letter-spacing:.14em}.how-steps article>i{display:grid;place-items:center;width:42px;height:42px;margin:28px 0 24px;border:1px solid var(--line);border-radius:13px;background:var(--control);color:var(--coral);font-style:normal;font-size:19px}.how-steps h4{font-size:18px;line-height:1.2;margin:0 0 10px}.how-steps p{min-height:60px;margin:0;color:var(--muted);font-size:11px;line-height:1.55}.how-steps a{display:inline-block;margin-top:18px;color:var(--ink);font-size:10px;font-weight:850;text-underline-offset:4px}.supplier-steps article>i{color:#0a826f}.how-capabilities{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0}.how-capabilities span{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:9px;font-weight:760}.how-capabilities span:before{content:"✓";margin-right:6px;color:#16846f}.how-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:25px;padding:22px 24px;border-radius:16px;background:var(--cocoa);color:#fff}.how-cta b,.how-cta small{display:block}.how-cta b{font-size:16px}.how-cta small{margin-top:4px;color:#d9cbd1;font-size:10px}.how-cta .primary{white-space:nowrap}.supplier-proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:26px 0;border:1px solid var(--line);border-radius:15px;overflow:hidden}.supplier-proof>div{min-height:125px;padding:20px;border-right:1px solid var(--line);background:var(--surface-2)}.supplier-proof>div:last-child{border-right:0}.supplier-proof small,.supplier-proof b,.supplier-proof span{display:block}.supplier-proof small{color:var(--coral);font-size:8px;font-weight:850;letter-spacing:.12em}.supplier-proof b{margin:12px 0 7px;font-size:18px}.supplier-proof span{color:var(--muted);font-size:9px;line-height:1.5}.supplier-cta>div:last-child{display:flex;align-items:center;gap:15px}.how-secondary{color:#fff;font-size:11px;font-weight:800;text-underline-offset:5px;white-space:nowrap}@keyframes howPanelIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.how-page main{min-height:calc(100vh - 72px);background:var(--bg)}.how-page .how-work{padding-top:92px}.how-page .how-role-panel{scroll-margin-top:86px}
@media(max-width:900px){.how-work{padding:85px 24px}.how-heading,.how-role-intro{grid-template-columns:1fr;gap:20px}.how-heading>p{max-width:680px}.how-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.supplier-proof{grid-template-columns:1fr 1fr}.supplier-proof>div:nth-child(2){border-right:0}.supplier-proof>div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:620px){.how-work{padding:70px 14px}.how-heading{padding:0 5px 28px}.how-heading h2{font-size:42px}.how-heading>p{font-size:13px}.how-role-tabs button{grid-template-columns:1fr;min-height:112px;padding:15px}.how-role-tabs button>span{grid-row:auto;width:31px;height:31px}.how-role-tabs b{font-size:13px}.how-role-tabs small{line-height:1.35}.how-role-panel{padding:26px 12px 18px;border-radius:0 0 18px 18px}.how-role-intro{padding:0 7px}.how-role-intro h3{font-size:33px}.how-steps{grid-template-columns:1fr}.how-steps article{min-height:0;padding:20px}.how-steps article>i{margin:20px 0 17px}.how-steps p{min-height:0}.how-capabilities{padding:0 4px}.how-cta{align-items:stretch;flex-direction:column;padding:20px}.how-cta .primary{text-align:center}.supplier-proof{grid-template-columns:1fr 1fr}.supplier-proof>div{min-height:145px;padding:15px}.supplier-cta>div:last-child{align-items:stretch;flex-direction:column}.how-secondary{text-align:center}}
@media(prefers-reduced-motion:reduce){.how-role-panel.active{animation:none}.how-steps article{transition:none}}
