.process{--process-ink:#061329;--process-paper:#FDFCF9;background:var(--process-paper);color:var(--process-ink);padding:32px clamp(24px,5vw,76px) 64px}
.process-inner{width:min(100%,1448px);margin-inline:auto}
.process-heading-row{display:grid;grid-template-columns:minmax(150px,.55fr) minmax(0,1.45fr);gap:36px;align-items:start;padding-top:16px;border-top:1px solid rgba(6,19,41,.25)}
.process-label{display:flex;align-items:center;gap:10px;margin:7px 0 0;font:600 12px/1.4 Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#536174}
.process-label span{width:7px;height:7px;border-radius:50%;background:#067ADB}
.process-intro h2{margin:0;font:800 clamp(38px,5vw,68px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.055em}
.process-intro>p{max-width:560px;margin:17px 0 0;color:#42516A;font:400 clamp(16px,1.5vw,19px)/1.55 Inter,Arial,sans-serif}
.process-film{position:relative;margin-top:clamp(30px,4vw,54px);aspect-ratio:16/9;overflow:hidden;background:#e9e7e2;isolation:isolate}
.process-video{position:relative;z-index:1;display:block;width:100%;max-width:none;height:100%;object-fit:contain;background:transparent}
.process-poster{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.process-film.process-enhanced{aspect-ratio:1280/515}
.process-film.process-enhanced .process-video{position:absolute;width:100%;max-width:none;height:auto;left:0;top:-18.4466%;object-fit:unset}
.process-copy{margin-top:20px}
.process-copy ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.process-copy li{display:grid;align-content:start;gap:8px;min-width:0}
.process-copy strong{font:800 22px/1.1 Manrope,Arial,sans-serif;letter-spacing:-.035em}
.process-copy span{color:#42516A;font:400 15px/1.5 Inter,Arial,sans-serif}
.process-controls{display:none;margin-top:0;border-bottom:1px solid rgba(6,19,41,.2)}
.process-js .process-controls{display:block}
.process-stages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid rgba(6,19,41,.2)}
.process-stages button{display:flex;align-items:center;gap:12px;min-height:58px;padding:8px 12px;border:0;border-right:1px solid rgba(6,19,41,.13);background:transparent;color:#5A6575;text-align:left;font:650 13px/1.2 Inter,Arial,sans-serif;cursor:pointer}
.process-stages button:first-child{border-left:1px solid rgba(6,19,41,.13)}
.process-stages button:hover{background:rgba(6,19,41,.045);color:var(--process-ink)}
.process-stages button[aria-current="step"]{background:var(--process-ink);color:var(--process-paper)}
.process-stage-number{font-size:10px;opacity:.64;font-variant-numeric:tabular-nums}
.process :is(button):focus-visible{outline:2px solid #067ADB;outline-offset:3px;position:relative;z-index:2}
.process-playback{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:15px 0}
.process-current{display:flex;align-items:baseline;gap:14px;margin:0;min-width:0}
.process-current strong{flex:none;font:750 15px/1.3 Manrope,Arial,sans-serif}
.process-current span{overflow:hidden;color:#536174;text-overflow:ellipsis;font:400 13px/1.45 Inter,Arial,sans-serif}
.process-playback-buttons{display:flex;gap:8px;flex:none}
.process-playback-buttons button{min-width:76px;min-height:44px;padding:0 14px;border:1px solid rgba(6,19,41,.28);background:transparent;color:var(--process-ink);font:650 12px/1 Inter,Arial,sans-serif;cursor:pointer}
.process-playback-buttons button:hover{background:var(--process-ink);color:var(--process-paper)}
.process-playback-buttons button:disabled{opacity:.45;cursor:default}
.process-js .process-copy{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%);border:0}
.process-js .process-copy li{display:grid}
.process-js .process-copy li[hidden]{display:none}
.process-error .process-poster{display:block}
.process-error .process-video{display:none}
.process-error .process-copy{position:static;width:auto;height:auto;margin-top:20px;overflow:visible;clip:auto;clip-path:none;white-space:normal}
.process-error .process-copy ol{grid-template-columns:repeat(5,minmax(0,1fr))}
.process-error .process-film.process-enhanced .process-video{display:none}
@media(max-width:700px){
 .process{padding:24px 24px 48px}
 .process-heading-row{grid-template-columns:1fr;gap:17px;padding-top:14px}
 .process-label{margin:0}
 .process-intro h2{font-size:clamp(38px,10vw,54px)}
 .process-intro>p{margin-top:12px;font-size:16px}
 .process-film{margin-top:25px}
 .process-copy ol{grid-template-columns:1fr}
 .process-film.process-enhanced{aspect-ratio:4/3}
 .process-film.process-enhanced .process-video{width:200%;max-width:none;left:-84.375%;top:-25%}
 .process-film.process-enhanced .process-poster{object-fit:cover;object-position:center}
 .process-js .process-copy{position:static;width:auto;height:auto;margin:17px 0 0;overflow:visible;clip:auto;clip-path:none;white-space:normal}
 .process-js .process-copy ol{display:block}
 .process-js .process-copy li{display:none;gap:6px}
 .process-js .process-copy li:first-child{display:grid}
 .process-js .process-copy strong{display:none}
 .process-js .process-copy span:first-of-type{display:block;color:var(--process-ink);font:800 25px/1.15 Manrope,Arial,sans-serif;letter-spacing:-.035em}
 .process-js .process-copy span:last-of-type{font-size:16px;line-height:1.45}
 .process-js .process-copy span{font-size:16px;line-height:1.45}
 .process-stages button{min-height:54px;justify-content:center;gap:5px;padding:6px 2px;flex-direction:column;font-size:11px}
 .process-stage-number{font-size:9px}
 .process-playback{align-items:flex-start;justify-content:flex-end;gap:10px;padding:13px 0}
 .process-current{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
 .process-current{display:grid;gap:3px}
 .process-current span{white-space:normal;font-size:12px}
 .process-playback-buttons button{min-width:58px;padding:0 9px}
 .process-error .process-copy ol{display:grid;grid-template-columns:1fr;gap:14px}
 .process-error .process-copy strong{display:block}
 .process-error .process-copy span:first-of-type{font:400 15px/1.5 Inter,Arial,sans-serif}
 .process-error .process-copy span:last-of-type{font:400 15px/1.5 Inter,Arial,sans-serif}
 .process-error .process-copy li{display:grid!important}
}
@media(max-width:360px){.process-stages button{font-size:10px}.process-playback-buttons{gap:5px}}
@media(prefers-reduced-motion:reduce){.process *{scroll-behavior:auto;transition:none!important;animation:none!important}}



/* Keep the selected stage as the only visible mobile caption. */
.process-js .process-copy li[hidden]{display:none!important}