/* Our Processes page (used with styles.css + flow.css) */
.proc{background:#f4f5f3;padding:70px 0 84px}
.proc-top{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:52px;align-items:center}
.proc-video,.machine{margin:0;min-width:0}
.video-box,.machine-photo{position:relative;background:#dfe3e3;border:1px solid #cdd3d4;overflow:hidden;box-shadow:0 20px 44px rgba(16,22,25,.15)}
.video-box{aspect-ratio:16/9;background:#0d1215}
.video-box video{display:block;width:100%;height:100%;object-fit:cover}
.machine-photo{aspect-ratio:4/3;box-shadow:0 10px 26px rgba(16,22,25,.1)}
.machine-photo img{display:block;width:100%;height:100%;object-fit:cover}
.ph{display:none;position:absolute;inset:0;align-items:center;justify-content:center;flex-direction:column;text-align:center;font:500 11px 'DM Mono',monospace;letter-spacing:1.5px;color:#7b878d;line-height:1.9;padding:12px}
.ph small{font-size:9px;letter-spacing:.6px;opacity:.8}
.missing .ph{display:flex}.missing img,.missing video{visibility:hidden}
.video-box.missing{background:#171e22}.video-box .ph{color:#8e999e}
.proc-video figcaption,.machine figcaption{font:500 10px 'DM Mono',monospace;letter-spacing:1.3px;color:#8a979d;margin-top:10px}
.proc-text h2{font-size:clamp(28px,3.2vw,40px);line-height:1.1;letter-spacing:-1.6px;margin:0 0 16px}
.proc-text p:not(.stage-num){font-size:14px;line-height:1.9;color:#52616a;margin:0}
.grid-title{margin:64px 0 22px}
.machine-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 22px}
.machine figcaption{display:flex;flex-direction:column;gap:3px}
.machine figcaption b{font:800 13px Manrope,Arial,sans-serif;letter-spacing:0;color:#152027}
@media(max-width:1000px){.proc-top{grid-template-columns:1fr;gap:30px}.machine-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.proc{padding:50px 0 60px}.machine-grid{grid-template-columns:1fr}}
.video-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.proc-video figcaption a{color:#d55d08}.proc-video figcaption a:hover{text-decoration:underline}
.yt-fallback{position:absolute;inset:0;display:block;background:#0d1215}
.yt-fallback img{width:100%;height:100%;object-fit:cover;display:block;opacity:.85}
.yt-fallback .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:48px;border-radius:12px;background:#ff6b00;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;padding-left:4px}
.yt-fallback .yt-note{position:absolute;left:14px;bottom:12px;font:500 10px 'DM Mono',monospace;letter-spacing:1.4px;color:#fff;text-shadow:0 1px 3px #000}
.yt-fallback:hover .play{background:#ff8a33}
.video-box.photo-main{aspect-ratio:4/3;background:#dfe3e3}.video-box.photo-main img{display:block;width:100%;height:100%;object-fit:cover}

/* Feature layout: Komax picture large in the centre, other machines around it */
.proc-intro{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:52px;align-items:end;margin-bottom:44px}
.proc-intro h2{font-size:clamp(28px,3.2vw,40px);line-height:1.1;letter-spacing:-1.6px;margin:0}
.proc-intro>p{font-size:14px;line-height:1.9;color:#52616a;margin:0}
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 22px;align-items:start}
.machine.feature{grid-column:2/4;grid-row:1/3;display:flex;flex-direction:column;height:100%}
.machine.feature .machine-photo{aspect-ratio:auto;flex:1;min-height:340px;background:#fff;box-shadow:0 20px 44px rgba(16,22,25,.15)}
.machine.feature figcaption b{font-size:15px}
.cta{background:#11181c;color:#fff;padding:24px 22px;display:flex;flex-direction:column;gap:12px;align-self:stretch;justify-content:center}
.cta .eyebrow{margin:0}.cta h3{font-size:18px;line-height:1.3;letter-spacing:-.5px;margin:0}
.cta .button{align-self:flex-start;margin-top:4px}
@media(max-width:1000px){.proc-intro{grid-template-columns:1fr;gap:18px}.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.machine.feature{grid-column:1/-1;grid-row:auto;order:-1}.machine.feature .machine-photo{min-height:0;aspect-ratio:1/1;flex:none}}
@media(max-width:650px){.bento{grid-template-columns:1fr}}
.machine.feature .machine-photo{background:#e9ecec}.machine.feature .machine-photo img{object-fit:contain}
.bento .cta{aspect-ratio:4/3;align-self:start;overflow:hidden}
