.process-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:32px 0 0}.process-card{position:relative;isolation:isolate;min-width:0;min-height:620px;border-radius:16px;overflow:hidden;background:#111827}.process-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}.process-panel{margin:28px 16px 0;padding:24px 15px;border-radius:28px;background:rgba(12,61,45,.93);text-align:center;min-height:365px;display:flex;align-items:center;flex-direction:column}.process-kicker{color:#22c55e;font-weight:800;font-size:15px;text-transform:uppercase;margin:0}.process-card:first-child .process-kicker{color:#ff6065}.process-card:last-child .process-kicker{color:#ffb329}.process-icon{width:108px;height:108px;border-radius:50%;background:#111827;display:grid;place-items:center;margin:20px 0}.process-icon img{width:64px;height:64px}.process-panel h3{font-size:18px;line-height:1.25;text-transform:uppercase;margin:0;min-height:46px}.process-description{font-size:15px;line-height:1.45;margin:16px 0 0;color:#fff}.process-description br{display:block;content:'';margin-top:8px}.process-controls{display:none}.process-track:focus-visible,.process-controls button:focus-visible{outline:2px solid #22c55e;outline-offset:4px}
@media(min-width:1500px){.process-card{min-height:690px}.process-panel{margin:36px 22px 0;padding:28px 20px}.process-icon{width:124px;height:124px}.process-panel h3{font-size:20px}}
@media(max-width:1100px){.process-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#22c55e #1c2938;padding-bottom:12px;gap:16px}.process-card{flex:0 0 calc((100% - 16px)/2);scroll-snap-align:start;min-height:640px}.process-panel{max-width:360px;margin:28px auto 0;width:calc(100% - 40px);min-height:350px}.process-controls{display:flex;justify-content:center;align-items:center;gap:22px;margin-top:16px}.process-controls button{width:44px;height:44px;border:1px solid #486454;background:#123d2e;color:white;border-radius:50%;font-size:24px;cursor:pointer}.process-controls button:disabled{opacity:.35;cursor:default}.process-count{font-size:14px;color:#d1d5db}}
@media(max-width:600px){.process-card{flex-basis:88%;min-height:650px}.process-panel{width:calc(100% - 28px);padding:24px 18px;min-height:360px}.process-panel h3{font-size:19px}.process-track{gap:12px}.process-icon{margin:18px 0}.process-description{font-size:15px}}
@media(prefers-reduced-motion:reduce){.process-track{scroll-behavior:auto}}
/* Keep the complete scene visible, with the text above its key subjects. */
.process-card{min-height:700px}.process-photo{top:auto;bottom:0;height:auto;object-fit:contain}.process-panel{min-height:410px}
@media(max-width:1100px){.process-card{min-height:760px}.process-panel{min-height:370px}}
@media(max-width:600px){.process-card{min-height:700px}.process-panel{min-height:380px}}
.process-photo{mask-image:linear-gradient(to bottom,transparent,#000 18%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%)}

/* Bilingual preview: align desktop process with the hero's content edges. */
@media(min-width:1101px){
 .site-main > .flow {grid-column:1 / -1;padding-left:5.5vw;padding-right:5.5vw;}
}
/* Place each mobile subject below the text; let the card grow with its text. */
@media(max-width:600px){
 .process-card {display:flex;flex-direction:column;}
 .process-panel {order:1;flex-shrink:0;}
 .process-photo {order:2;position:relative;inset:auto;flex-shrink:0;max-width:none;height:auto;width:100%;margin-top:-180px;}
 .process-card:nth-child(2) .process-photo {width:125%;margin-top:-220px;align-self:flex-start;}
 .process-card:nth-child(3) .process-photo {width:100%;margin-top:-85px;align-self:flex-end;}
 .process-card:nth-child(4) .process-photo {width:115%;margin-top:-200px;align-self:flex-end;}
}
@media(min-width:1101px){
 .process-card:nth-child(3) .process-photo {top:350px;bottom:auto;}
}
/* Agreed section heading sizes; keep Montserrat Bold. */
#flow-title { font-size:28px; font-weight:700; line-height:1.2; }
@media(max-width:600px){#flow-title { font-size:24px; }}

.flow-columns .process-answer { color:var(--vm-verify-green); }

.process-controls button { display:grid; place-items:center; padding:0; border-radius:6px; border-color:#287047; background:#14532d; }
.process-controls button svg { display:block; }
.process-prev svg { transform:rotate(180deg); }
.process-controls button:not(:disabled):hover { background:#166534; border-color:#22c55e; }

.flow-columns .process-challenge { color:var(--vm-critical); }
