.processing-flow-section{max-width:1220px;margin:68px auto 0;padding:34px clamp(18px,4vw,60px) 42px;border:1px solid #dce5d5;border-radius:24px;background:#e9eee2}
.processing-flow-heading{margin-bottom:22px}
.processing-diagram{position:relative;max-width:1000px;margin:0 auto;isolation:isolate}
.processing-diagram-path{position:absolute;z-index:0;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:#7ed645;stroke-width:17;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.processing-diagram-path path:nth-of-type(1),.processing-diagram-path path:nth-of-type(2),.processing-diagram-path path:nth-of-type(3){marker-end:url(#flow-tip)}
.processing-diagram-path .processing-leaf{fill:#46a329;stroke:#267c29;stroke-width:3}
.processing-diagram-steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,300px);gap:20px 0;margin:0;padding:0;list-style:none}
.processing-diagram-steps li{display:flex;flex-direction:column;align-items:center;width:min(100%,335px);margin-inline:auto;text-align:center}
.processing-diagram-icon{position:relative;display:grid;place-items:center;flex:none;width:144px;height:144px;margin:13px 0 14px;border:7px solid #86d451;border-radius:50%;background:#f7fbf1;color:#0d3929}
.processing-diagram-icon>svg{display:block;width:88px;height:88px;fill:none;stroke:currentColor;stroke-width:5;stroke-linejoin:round;stroke-linecap:round}
.processing-diagram-icon .leaf{fill:#8ddc54;stroke:#0d3929}
.processing-diagram-number{position:absolute;top:-13px;left:-17px;display:grid;place-items:center;width:53px;height:53px;border:4px solid #e9eee2;border-radius:50%;background:#bdf17f;color:#0d3929;font:800 20px/1 var(--font-display)}
.processing-diagram-steps h3{margin:0 0 5px;color:#103b2b;font:800 clamp(19px,2vw,24px)/1.15 var(--font-display);letter-spacing:-.035em}
.processing-diagram-steps p{max-width:285px;margin:0;color:#61777b;font-size:16px;line-height:1.38}
@media(max-width:700px){.processing-flow-section{margin-top:44px;padding:25px 16px 32px}.processing-flow-heading{margin-bottom:30px}.processing-flow-heading h2{font-size:clamp(27px,7vw,38px)}.processing-diagram-path{display:none}.processing-diagram-steps{display:flex;flex-direction:column;gap:34px}.processing-diagram-steps li{position:relative;display:grid;grid-template-columns:94px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:14px;width:100%;max-width:520px;margin-inline:auto;text-align:left}.processing-diagram-icon{grid-column:1;grid-row:1 / 3;width:86px;height:86px;margin:0;border-width:5px}.processing-diagram-icon>svg{width:52px;height:52px;stroke-width:5}.processing-diagram-number{top:-11px;left:-10px;width:34px;height:34px;border-width:3px;font-size:14px}.processing-diagram-steps h3{grid-column:2;align-self:end;margin:0 0 5px;font-size:18px}.processing-diagram-steps p{grid-column:2;align-self:start;max-width:none;font-size:14px;line-height:1.45}.processing-diagram-steps li:not(:last-child)::after{content:"";position:absolute;left:42px;top:calc(100% + 3px);height:27px;border-left:5px solid #80d24a;border-radius:8px}.processing-diagram-steps li:not(:last-child)::before{content:"";position:absolute;left:34px;top:calc(100% + 22px);width:15px;height:15px;border-right:5px solid #80d24a;border-bottom:5px solid #80d24a;transform:rotate(45deg)}}
@media(max-width:380px){.processing-diagram-steps li{grid-template-columns:80px minmax(0,1fr);column-gap:10px}.processing-diagram-icon{width:74px;height:74px}.processing-diagram-icon>svg{width:44px;height:44px}.processing-diagram-steps h3{font-size:16px}.processing-diagram-steps p{font-size:13px}.processing-diagram-steps li:not(:last-child)::after{left:36px}.processing-diagram-steps li:not(:last-child)::before{left:28px}}

/* Recortes fotográficos gerados para cada etapa do preparo. */
.processing-diagram-icon{width:228px;height:156px;margin:4px 0 11px;border:0;border-radius:0;background:transparent;overflow:visible}
.processing-diagram-icon>img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 9px 11px rgba(24,56,37,.14))}
.processing-diagram-number{top:0;left:0;z-index:2}
.processing-diagram-steps{grid-template-rows:repeat(2,300px)}
@media(max-width:700px){.processing-diagram-steps li{grid-template-columns:116px minmax(0,1fr);column-gap:10px}.processing-diagram-icon{width:112px;height:100px;margin:0}.processing-diagram-icon>img{width:112px;height:100px}.processing-diagram-number{top:0;left:0}.processing-diagram-steps li:not(:last-child)::after{left:53px}.processing-diagram-steps li:not(:last-child)::before{left:45px}}
@media(max-width:380px){.processing-diagram-steps li{grid-template-columns:94px minmax(0,1fr)}.processing-diagram-icon,.processing-diagram-icon>img{width:90px;height:88px}.processing-diagram-steps li:not(:last-child)::after{left:43px}.processing-diagram-steps li:not(:last-child)::before{left:35px}}

/* Fluxo solto, sem painel ao redor. */
.processing-flow-section{max-width:1220px;border:0;border-radius:0;background:transparent;box-shadow:none}
@media(max-width:700px){.processing-flow-section{border:0;border-radius:0;background:transparent}}

/* No computador, as quatro etapas seguem uma única linha. */
@media(min-width:901px){
  .processing-diagram{max-width:1120px}
  .processing-diagram-path{display:none}
  .processing-diagram-steps{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto;gap:36px}
  .processing-diagram-steps li{position:relative;width:100%;max-width:none}
  .processing-diagram-icon{width:min(100%,215px);height:156px}
  .processing-diagram-steps h3{font-size:clamp(18px,1.5vw,22px)}
  .processing-diagram-steps p{font-size:15px}
  .processing-diagram-steps li:not(:last-child)::after{content:"→";position:absolute;top:63px;right:-37px;width:38px;color:#79d442;font:800 42px/1 var(--font-display);text-align:center}
}
