/* Three optical studies share the hero's glass and satin silver materials. */
.workflow-heading{margin-bottom:28px}
.workflow-heading h2{font-size:clamp(34px,4vw,58px);line-height:1.12}
.workflow{min-width:0}
.workflow-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;margin:0;padding:0}
.workflow-card{min-width:0;position:relative}
.workflow-card[hidden],.workflow-controls[hidden]{display:none}
.workflow-card:not(:last-child):after{content:'→';position:absolute;right:-24px;top:145px;font-size:16px;color:#888}
.workflow-art{position:relative;height:320px;overflow:hidden;isolation:isolate}
.workflow-art:before{content:'';position:absolute;inset:10% 0 0;background:radial-gradient(ellipse at 50% 50%,#ffffff09,transparent 68%);pointer-events:none}
.workflow-scene{position:absolute;width:320px;height:300px;left:50%;top:50%;transform:translate(-50%,-50%);font-family:Body,Arial,sans-serif}
.workflow-orbit{position:absolute;inset:35px 16px 5px;border:1px solid #ffffff0d;border-radius:50%;transform:rotate(-27deg) scaleY(.85)}
.workflow-plane{position:absolute;isolation:isolate;box-sizing:border-box;border:1px solid #ffffff24;border-radius:9px;color:#e9e9e9;background:var(--glass-body,linear-gradient(145deg,#363636b0,#242424bd));box-shadow:inset 0 1px 1px #ffffff16,inset -1px -1px 2px #ffffff06,5px 15px 26px #0008;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:workflow-drift 8s ease-in-out infinite paused}
.workflow.is-running .workflow-plane{animation-play-state:running}
.workflow-plane:after{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:var(--glass-rim);pointer-events:none;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}
.workflow-micro{display:block;font-size:6px;line-height:1.5;letter-spacing:.1em;color:#bcbcbc}
.workflow-lines{display:grid;gap:7px;margin-top:20px}
.workflow-lines i{display:block;height:3px;background:#bcbcbc35;border-radius:1px}
.workflow-lines i:nth-child(2){width:76%}
.workflow-lines i:nth-child(3){width:56%}
.workflow-sheet{width:205px;height:165px;padding:17px}
.workflow-sheet strong{display:block;font:700 22px/1.15 Display,Arial,sans-serif;letter-spacing:-.035em;margin-top:10px}
.workflow-sheet--rear{left:27px;top:22px;transform:rotate(-8deg);background:linear-gradient(140deg,#3333338c,#1d1d1d9c);animation-delay:-3s}
.workflow-sheet--middle{left:80px;top:91px;transform:rotate(6deg);animation-delay:-5s}
.workflow-audience{display:flex;gap:11px;margin-top:22px}
.workflow-audience i{width:23px;height:23px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#b9b9b9,#393939 75%);box-shadow:inset 0 1px 1px #ffffff4d}
.workflow-sheet--front{left:42px;top:161px;transform:rotate(-4deg);height:114px;background:radial-gradient(ellipse at 0% 0%,#ffffff18,transparent 70%),linear-gradient(145deg,#343434ba,#202020bd)}
.workflow-sheet--front .workflow-lines{margin-top:12px;gap:5px}
.workflow-sheet--front strong{font-size:22px;margin-top:10px}
.workflow-sheet-foot{position:absolute;bottom:13px;font-size:6px;letter-spacing:.08em;color:#aaa}
.workflow-plan-tag{left:184px;top:249px;display:flex;gap:8px;align-items:center;padding:10px 12px;font-size:9px;white-space:nowrap;transform:rotate(5deg);animation-delay:-2s;background:linear-gradient(145deg,#424242cf,#242424e0)}
.workflow-scene--plan .workflow-plane{animation-delay:0s}
.workflow-spark{font-size:19px;color:#ddd}
.workflow-profile{left:28px;top:49px;width:157px;height:204px;padding:17px;transform:rotate(-10deg);animation-delay:-4s}
.workflow-profile-top{display:flex;align-items:center;gap:10px;margin-top:19px}
.workflow-profile-top>i{flex-shrink:0;width:27px;height:27px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#b6b6b6,#434343)}
.workflow-profile-top .workflow-lines{margin:0;width:66px;gap:6px}
.workflow-highlights{display:flex;gap:10px;margin-top:17px}
.workflow-highlights i{width:18px;height:18px;border:1px solid #ffffff38;border-radius:50%;box-shadow:inset 0 0 0 3px #ffffff06}
.workflow-profile-grid{display:flex;gap:5px;margin-top:17px}
.workflow-profile-grid i{width:33px;height:44px;background:linear-gradient(135deg,#ffffff1f,#ffffff07);border:1px solid #ffffff15;border-radius:2px}
.workflow-video{left:133px;top:26px;width:168px;height:235px;padding:16px;transform:rotate(10deg)}
.workflow-video strong{display:block;font:700 24px/.99 Display,Arial,sans-serif;letter-spacing:-.045em;margin-top:22px}
.workflow-video img{position:absolute;left:28px;bottom:23px;width:111px;height:auto}
.workflow-video-foot{position:absolute;bottom:13px;font-size:5px;letter-spacing:.08em;color:#bcbcbc}
.workflow-editor{left:44px;top:227px;width:242px;height:67px;padding:10px 13px;transform:rotate(-3deg);background:linear-gradient(145deg,#414141ab,#292929c7);animation-delay:-2s}
.workflow-editor>div{display:grid;gap:3px;margin-top:5px}
.workflow-editor i{display:block;height:8px;width:85%;font-style:normal;font-size:5px;line-height:8px;padding-left:6px;color:#292929;background:linear-gradient(90deg,#8a8a8a,#b5b5b5);border-radius:1px}
.workflow-editor i:nth-child(2){margin-left:14%;width:86%;background:linear-gradient(90deg,#c8c8c8,#e3e3e3)}
.workflow-editor i:nth-child(3){width:90%;background:#858585}
.workflow-playhead{position:absolute;left:28px;top:24px;bottom:6px;width:1px;background:#eeeeeea8}
.workflow-report{left:30px;top:37px;width:223px;height:190px;padding:19px;transform:rotate(-9deg);animation-delay:-3s}
.workflow-report strong{display:block;font:700 24px/1.1 Display,Arial,sans-serif;letter-spacing:-.035em;margin-top:15px}
.workflow-bars{display:flex;gap:9px;align-items:end;height:65px;margin-top:17px;border-bottom:1px solid #ffffff26;padding:0 4px}
.workflow-bars i{flex:1;height:62%;background:linear-gradient(#c8c8c8aa,#64646433);border-radius:2px 2px 0 0;border-top:1px solid #ffffff4d}
.workflow-bars i:nth-child(2){height:84%}.workflow-bars i:nth-child(3){height:48%}.workflow-bars i:nth-child(4){height:70%}.workflow-bars i:nth-child(5){height:93%}.workflow-bars i:nth-child(6){height:56%}.workflow-bars i:nth-child(7){height:73%}
.workflow-report-foot{display:flex;justify-content:space-between;margin-top:9px;font-size:5px;letter-spacing:.08em;color:#bcbcbc}
.workflow-feedback{pointer-events:none;position:absolute;inset:0;width:100%;height:100%;color:#b8b8b880}
.workflow-next{left:142px;top:157px;width:156px;height:134px;padding:15px;transform:rotate(9deg);background:radial-gradient(ellipse at 0% 0%,#ffffff20,transparent 65%),linear-gradient(145deg,#424242b8,#282828d6);animation-delay:-5s}
.workflow-next strong{display:block;font:700 21px/1.08 Display,Arial,sans-serif;letter-spacing:-.03em;margin-top:16px}
.workflow-next-icon{position:absolute;right:12px;top:10px;font-size:16px;line-height:1;color:#bcbcbc}
.workflow-next>.workflow-micro{padding-right:14px}
.workflow-scene--review .workflow-orbit{display:none}
.workflow-next .workflow-lines{margin-top:15px;gap:5px}
.workflow-copy{padding-top:22px;border-top:1px solid var(--hud-rule,#ffffff2e)}
.workflow-index{font-size:9px;letter-spacing:.08em;color:#a8a8a8}
.workflow-copy h3{font:700 27px/1.1 Display,Arial,sans-serif;letter-spacing:-.035em;margin:13px 0 14px;max-width:300px}
.workflow-copy p{font-size:14px;line-height:1.8;color:#b9b9b9;max-width:370px;margin:0}
@keyframes workflow-drift{50%{translate:0 -7px}}
@media(min-width:1000px) and (max-width:1150px){.workflow-track{gap:24px}.workflow-card:not(:last-child):after{right:-19px}.workflow-scene{transform:translate(-50%,-50%) scale(.9)}.workflow-copy h3{font-size:25px}}
@media(max-width:999px){
  .workflow-heading{margin-bottom:10px}
  .workflow-heading h2{font-size:45px}
  .workflow-track{grid-template-columns:1fr;gap:38px;max-width:540px;margin-inline:auto}
  .workflow-card:not(:last-child):after{content:none}
  .workflow-art{height:310px}
  .workflow-copy{padding-top:19px}
  .workflow-copy h3{max-width:none}
  .workflow-copy p{max-width:none}
  .workflow.is-carousel{max-width:540px;margin-inline:auto}
  .is-carousel .workflow-track{position:relative;display:block;overflow:hidden;touch-action:pan-y pinch-zoom}
  .is-carousel .workflow-card.is-exiting{position:absolute;inset:0 0 auto;pointer-events:none}
  .is-carousel .workflow-track.is-measuring .workflow-card{display:block!important;position:absolute;inset:0 0 auto;visibility:hidden}
  .workflow-controls{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px 12px;align-items:center;margin-top:16px}
  .workflow-arrows{display:contents}
  [data-workflow-prev]{grid-column:1;grid-row:2}
  [data-workflow-next]{grid-column:3;grid-row:2}
  .workflow-arrow{display:grid;place-items:center;width:44px;height:44px;border:1px solid #ffffff45;border-radius:50%;background:linear-gradient(140deg,#ffffff0c,#ffffff02);color:#e4e4e4;cursor:pointer;transition:background .2s,border-color .2s,opacity .2s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .workflow-arrow svg{width:20px;height:20px}
  .workflow-arrow:disabled{opacity:.25;cursor:default}
  .workflow-arrow:focus-visible,.workflow-steps button:focus-visible{outline:2px solid #e2e2e2;outline-offset:4px}
  .workflow-counter{grid-column:2;grid-row:2;font-size:10px;letter-spacing:.1em;color:#bcbcbc;min-width:60px;text-align:center;font-variant-numeric:tabular-nums}
  .workflow-steps{display:grid;grid-column:1/-1;grid-row:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:0}
  .workflow-steps button{position:relative;min-height:44px;padding:13px 0 8px;border:0;border-top:1px solid #ffffff28;background:none;text-align:left;font:400 10px/1.4 Body,Arial,sans-serif;color:#969696;cursor:pointer;transition:color .25s,border-color .25s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .workflow-steps button[aria-current=step]{border-color:#e5e5e5;color:#ededed}
  .is-carousel .workflow-card[hidden] .workflow-plane{animation-play-state:paused}
}
@media(max-width:560px){
  #process{display:flex;flex-direction:column;min-height:calc(100svh - 70px);padding-block:26px}
  #process>.container{display:flex;flex-direction:column;flex:1}
  #process .workflow{margin-block:auto;width:100%}
  #process .section-label{font-size:8px;line-height:1.5;margin-bottom:14px}
  .workflow-heading{margin-bottom:0}
  .workflow-heading h2{font-size:clamp(26px,7.2vw,30px);line-height:1.1}
  .workflow-art{height:var(--workflow-art-height,clamp(140px,36svh,340px))}
  .workflow-scene{transform:translate(-50%,-50%) scale(var(--workflow-scene-scale,.6))}
  .workflow-copy{padding-top:16px}
  .workflow-index{font-size:8px;line-height:1.5}
  .workflow-copy h3{font-size:24px;max-width:none;line-height:1.1;margin:10px 0 12px}
  .workflow-copy p{font-size:14px;line-height:1.6}
  .workflow-controls{margin-top:20px;column-gap:10px}
  .workflow-steps button{font-size:10px}
}
@media(max-width:560px) and (max-height:600px){#process{padding-block:20px}.workflow-controls{margin-top:16px}}
@media(max-width:350px){.workflow-copy h3{font-size:22px}.workflow-controls{column-gap:8px}.workflow-steps{gap:6px}.workflow-steps button{font-size:9px}}
@media(hover:hover){.workflow-arrow:not(:disabled):hover{background:#ffffff14;border-color:#ffffff80}.workflow-steps button:hover{color:#eee}}
@media(prefers-reduced-motion:reduce){.workflow-plane{animation:none}}
@media(forced-colors:active){.workflow-plane{background:Canvas;border-color:CanvasText;backdrop-filter:none}.workflow-plane:after{display:none}.workflow-arrow,.workflow-steps button{color:ButtonText;border-color:ButtonText}.workflow-steps button[aria-current=step]{color:Highlight;border-color:Highlight}}
