/* Alternating creative process, connected by one quiet red thread. */
.process-section{scroll-margin-top:90px;padding-top:70px;padding-bottom:70px}
.process-board{max-width:1180px;margin:auto;padding:64px clamp(20px,4vw,60px) 66px;border:1px solid var(--line);border-radius:36px;background:var(--surface);color:var(--ink)}
.process-intro{text-align:center;margin-bottom:40px}.process-eyebrow{display:inline-flex;gap:9px;align-items:center;padding:6px 12px;border:1px solid var(--line);border-radius:20px;font-size:13px;color:var(--muted)}.process-eyebrow i{display:block;width:6px;height:6px;border-radius:50%;background:#be1e2d}
.process-intro h2{font:600 clamp(42px,5vw,68px)/1.05 Afacad,Arial,sans-serif;letter-spacing:-.04em;margin:18px 0 14px}.process-intro>p{font-size:21px;line-height:1.35;max-width:37ch;margin:auto;color:var(--muted)}
.process-timeline{position:relative;max-width:920px;margin:auto;isolation:isolate}.process-list{list-style:none;position:relative;margin:0;padding:0;display:grid;gap:16px}
.process-step{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);min-height:152px;align-items:center;padding:24px 28px;border-radius:24px;column-gap:0;background:transparent;transition:background .35s ease}
.process-step.is-current{background:var(--soft)}
.process-visual{display:flex;gap:16px;justify-content:flex-end;align-items:center;padding-right:12px;grid-column:1;grid-row:1}
.process-icon{display:grid;place-items:center;width:62px;height:62px;flex:none;border-radius:18px;color:var(--ink);border:1px solid var(--line);background:var(--surface);transition:background .3s,color .3s,border-color .3s}.process-icon svg{width:32px;height:32px}.process-number{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;min-width:19px}
.process-step.is-current .process-icon{background:#be1e2d;color:#fff5e1;border-color:#be1e2d}
.process-marker{position:relative;z-index:2;grid-column:2;grid-row:1;justify-self:center;display:block;width:13px;height:13px;border:2px solid var(--line);border-radius:50%;background:var(--surface);transition:background .3s,border-color .3s,box-shadow .3s}
.process-step.is-reached .process-marker,.process-step.is-current .process-marker{border-color:#be1e2d;background:#be1e2d}.process-step.is-current .process-marker{box-shadow:0 0 0 6px #be1e2d20}
.process-copy{grid-column:3;grid-row:1;padding-left:12px;max-width:34ch}.process-copy h3{font:600 28px/1.1 Afacad,Arial,sans-serif;letter-spacing:-.02em;margin:0 0 10px}.process-copy p{font-size:19px;line-height:1.35;margin:0;color:var(--muted)}
.process-step:nth-child(even) .process-copy{grid-column:1;padding-left:0;padding-right:12px;text-align:right;justify-self:end}.process-step:nth-child(even) .process-visual{grid-column:3;justify-content:flex-start;padding-right:0;padding-left:12px;flex-direction:row-reverse;justify-self:start}
.process-rail{position:absolute;z-index:1;left:50%;top:var(--rail-start,76px);height:var(--rail-length,calc(100% - 152px));width:2px;background:var(--line);transform:translateX(-50%);pointer-events:none}.process-rail>span{display:block;height:100%;width:100%;background:#be1e2d;transform:scaleY(var(--process-progress,0));transform-origin:50% 0}
@media(max-width:760px){.process-section{padding-top:45px;padding-bottom:45px}.process-board{padding:40px 18px 30px;border-radius:26px}.process-intro{margin-bottom:30px}.process-intro h2{font-size:45px}.process-intro>p{font-size:19px;max-width:25ch}.process-list{gap:10px}.process-step{grid-template-columns:32px minmax(0,1fr);padding:22px 14px 22px 6px;min-height:174px;row-gap:14px;border-radius:18px}.process-marker{grid-column:1;grid-row:1/3;width:11px;height:11px}.process-copy,.process-step:nth-child(even) .process-copy{grid-column:2;grid-row:2;padding:0 0 0 14px;text-align:left;justify-self:start;max-width:100%}.process-visual,.process-step:nth-child(even) .process-visual{grid-column:2;grid-row:1;justify-self:start;justify-content:flex-start;flex-direction:row;gap:12px;padding:0 0 0 14px}.process-icon{width:43px;height:43px;border-radius:13px}.process-icon svg{width:25px;height:25px}.process-copy h3{font-size:25px;margin-bottom:7px}.process-copy p{font-size:18px}.process-number{font-size:13px}.process-rail{left:22px}}
@media(prefers-reduced-motion:reduce){.process-step,.process-icon,.process-marker{transition:none}}

/* DOT selection and quiet rail easing. */
::selection{background:#be1e2d;color:#fff5e1;text-shadow:none}
::-moz-selection{background:#be1e2d;color:#fff5e1;text-shadow:none}
.process-rail>span{transition:transform .12s linear}
@media(prefers-reduced-motion:reduce){.process-rail>span{transition:none}}
