/* The user explicitly requested numbered stations and a connecting textile thread. */
.process-with-thread .editorial-process-layout{grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);gap:clamp(48px,6vw,96px)}
.process-with-thread .process-intro{position:sticky;top:120px;align-self:start}
.process-with-thread .editorial-process-intro{max-width:32ch}
.process-with-thread .process-cta{gap:14px;padding-inline:18px}
.process-journey{position:relative;min-width:0}
.process-with-thread .process-stations{position:relative;display:flex;flex-direction:column;gap:32px;list-style:none}
.process-with-thread .process-stations>li{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) 184px;column-gap:22px;align-items:start;min-height:164px;padding:10px 0 14px;border:0}
.process-stations .process-step-index{position:relative;z-index:1;display:block;padding:4px 0 8px;background:var(--studios-accent);color:var(--mg-color-orange-200);font:400 46px/1 var(--mg-font-family);letter-spacing:-.065em;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"zero" 0;text-align:center}
.process-stations .process-step-copy{padding-top:7px}
.process-with-thread .process-stations h3{font-size:26px;line-height:1.15;margin-bottom:14px;letter-spacing:-.03em}
.process-with-thread .process-stations p{font-size:18px;line-height:1.5;max-width:none}
.process-art-play{position:relative;display:block;width:184px;min-height:154px;margin:0;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;border-radius:8px}
.process-art-play:focus-visible{outline:3px solid var(--mg-color-white);outline-offset:6px}
.process-station-art{display:block;width:100%;height:auto;overflow:visible}
.process-motion-toggle{display:flex;align-items:center;gap:9px;width:max-content;margin-top:22px;padding:9px 0;min-height:44px;border:0;background:transparent;color:var(--mg-color-white);font:400 14px/1.4 var(--mg-font-family);cursor:pointer}
.process-motion-toggle>svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.process-motion-toggle .process-play-mark{display:none}
.process-motion-toggle[aria-pressed=true] .process-play-mark{display:block}
.process-motion-toggle[aria-pressed=true] .process-pause-mark{display:none}
.process-motion-toggle:focus-visible{outline:2px solid var(--mg-color-white);outline-offset:5px}
.process-thread{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;fill:none;z-index:0}
.process-thread-guide{stroke:var(--mg-color-purple-300);stroke-width:4;stroke-dasharray:6 7;stroke-linecap:round;opacity:.7}
.process-thread-running{stroke:var(--mg-color-orange-200);stroke-width:5.5;stroke-dasharray:100 100;stroke-dashoffset:100;stroke-linecap:round}
.process-thread-needle{stroke:var(--mg-color-white);stroke-width:2.8;stroke-linecap:round;opacity:0}
.process-thread-needle ellipse{stroke:var(--mg-color-orange);stroke-width:1.4}
.process-with-thread.is-thread-moving .process-thread-needle{opacity:1}
.process-stations .process-step-index{color:var(--mg-color-purple-200);transition:color 180ms ease}
.process-stations .is-reached .process-step-index{color:var(--mg-color-orange-200)}
.process-stations .is-current .process-step-index{color:var(--mg-color-white)}
.process-station-art :is(.process-shirt,.process-sock,.process-spark,.process-pencil,.process-swatches,.process-proof,.process-seal,.process-check,.process-flaps,.process-parcel-sock){transform-box:fill-box;transform-origin:center;animation-duration:1.65s;animation-timing-function:cubic-bezier(.33,0,.3,1);animation-iteration-count:infinite}
.process-station-art .process-pencil{transform-origin:15% 90%}
.process-station-art .process-check{transform-origin:center;stroke-dasharray:1;stroke-dashoffset:0}
.process-station-art .process-flaps{transform-origin:center bottom}
@media(prefers-reduced-motion:no-preference){
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-shirt{animation-name:process-shirt-turn}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-sock{animation-name:process-sock-lift}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-spark{animation-name:process-spark-turn}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-pencil{animation-name:process-pencil-draw}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-swatches{animation-name:process-swatch-turn}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-proof{animation-name:process-proof-settle}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-seal{animation-name:process-seal-stamp}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-check{animation-name:process-check-draw}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-flaps{animation-name:process-flaps-open}
 .process-with-thread:not(.process-motion-paused) .process-stations>li:is(.is-hovered,:has(.process-art-play:focus-visible),.is-playing) .process-parcel-sock{animation-name:process-parcel-open}
}
@keyframes process-shirt-turn{0%,100%{transform:none}35%{transform:translateY(-3px) rotate(4deg)}72%{transform:translateY(-1px) rotate(-2deg)}}
@keyframes process-sock-lift{0%,100%{transform:none}42%{transform:translateY(-7px) rotate(-5deg)}76%{transform:translateY(-3px) rotate(1deg)}}
@keyframes process-spark-turn{0%,100%{transform:none;opacity:1}48%{transform:rotate(16deg) scale(.9);opacity:.65}}
@keyframes process-pencil-draw{0%,100%{transform:none}26%{transform:translate(-5px,4px) rotate(-7deg)}54%{transform:translate(4px,-2px) rotate(3deg)}78%{transform:translate(-2px,2px) rotate(-3deg)}}
@keyframes process-swatch-turn{0%,100%{transform:none}45%{transform:translateY(-3px) rotate(8deg)}}
@keyframes process-proof-settle{0%,100%{transform:none}30%{transform:translateY(-3px) rotate(-2deg)}65%{transform:rotate(1deg)}}
@keyframes process-seal-stamp{0%,100%{transform:none}24%{transform:translateY(-4px) scale(1.04)}48%{transform:scale(.96)}70%{transform:none}}
@keyframes process-check-draw{0%,12%{stroke-dashoffset:1;opacity:0}28%{opacity:1}64%,100%{stroke-dashoffset:0;opacity:1}}
@keyframes process-flaps-open{0%,100%{transform:none}40%,68%{transform:translateY(-4px) scaleY(.93)}}
@keyframes process-parcel-open{0%,100%{transform:none}40%,68%{transform:translateY(-10px) rotate(-7deg)}}
@media(max-width:1023px){
 .process-with-thread .editorial-process-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);gap:36px}
 .process-with-thread .process-stations>li{grid-template-columns:48px minmax(0,1fr) 118px;column-gap:14px;min-height:152px}
 .process-stations .process-step-index{font-size:38px}
 .process-art-play{width:118px;min-height:100px}
 .process-with-thread .process-stations h3{font-size:23px}
 .process-with-thread .process-stations p{font-size:17px}
}
@media(max-width:760px){
 .process-with-thread .editorial-process-layout{grid-template-columns:1fr;gap:38px}
 .process-with-thread .process-intro{position:static}
 .process-with-thread .process-stations{gap:32px}
 .process-with-thread .process-stations>li{grid-template-columns:44px minmax(0,1fr) 104px;column-gap:12px;min-height:140px;padding-block:8px 10px}
 .process-stations .process-step-index{font-size:34px;padding-top:4px;padding-bottom:8px}
 .process-with-thread .process-stations h3{font-size:21px;margin-bottom:10px}
 .process-with-thread .process-stations p{font-size:16px;line-height:1.5}
 .process-art-play{width:104px;min-height:92px}
 .process-motion-toggle{margin-top:16px}
}
@media(max-width:359px){
 .process-with-thread .process-cta{gap:10px;padding-inline:14px;max-width:100%}
 .process-with-thread .process-stations>li{grid-template-columns:38px minmax(0,1fr) 84px;column-gap:10px}
 .process-stations .process-step-index{font-size:30px}
 .process-art-play{width:84px;min-height:76px}
 .process-with-thread .process-stations h3{font-size:20px}
}
@media(prefers-reduced-motion:reduce){
 .process-with-thread .process-station-art *{animation:none!important;transition:none!important}
 .process-thread-needle,.process-motion-toggle{display:none!important}
 .process-stations .process-step-index{transition:none}
}
