.vision-world{
  --vision-accent:#72d6c6;
  --vision-accent-soft:rgba(114,214,198,.16);
  --vision-line:rgba(198,217,206,.18);
  --vision-deep:#03090b;
  min-height:100svh;
  color:var(--paper);
  background:var(--vision-deep);
  overflow:clip;
}
.vision-shell{position:relative;isolation:isolate;background:radial-gradient(circle at 72% 4%,rgba(114,214,198,.11),transparent 29%),var(--vision-deep)}
.vision-header{position:absolute;z-index:30;top:0;left:var(--gutter);right:var(--gutter);width:auto;height:92px;display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--vision-line)}
.vision-header>p{margin-left:auto;color:var(--muted);font-size:11px;letter-spacing:.13em;text-transform:uppercase}
.vision-header .text-link{color:var(--paper);font-size:12px}
.vision-header .text-link:focus-visible,.vision-outro .text-link:focus-visible{outline-color:var(--vision-accent)}
.vision-brand{display:grid;place-items:center;width:124px;height:44px;border-radius:3px;background:var(--paper);flex:0 0 auto}
.vision-brand img{width:98px;height:auto}
.vision-progress{position:fixed;z-index:60;right:18px;top:50%;transform:translateY(-50%);height:210px;display:grid;grid-template-rows:auto 1fr auto;justify-items:center;gap:12px;color:var(--muted);pointer-events:none}
.vision-progress span{font:500 9px/1 'Public Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;writing-mode:vertical-rl}
.vision-progress i{position:relative;width:1px;height:100%;overflow:hidden;background:rgba(198,217,206,.2)}
.vision-progress i:after{content:'';position:absolute;inset:0;background:var(--vision-accent);transform:scaleY(var(--vision-progress,0));transform-origin:top;transition:transform .1s linear}
.vision-progress b{font:400 10px/1 Outfit,sans-serif;color:var(--vision-accent)}

.vision-intro{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:150px 0 104px;background:radial-gradient(ellipse at 68% 45%,rgba(114,214,198,.12),transparent 35%),linear-gradient(180deg,#071415 0%,var(--vision-deep) 90%)}
.vision-gridlines{position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(198,217,206,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(198,217,206,.12) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 72% 44%,#000,transparent 62%)}
.vision-intro__content{position:relative;z-index:2}
.vision-kicker{display:flex;align-items:center;gap:16px;color:var(--vision-accent);font-size:11px;letter-spacing:.17em;text-transform:uppercase}
.vision-kicker span{display:grid;place-items:center;width:33px;height:33px;border:1px solid currentColor;border-radius:50%;font-family:Outfit,sans-serif;letter-spacing:0}
.vision-intro h2{max-width:12ch;margin-top:34px;font-size:clamp(50px,7.7vw,116px);line-height:.92;letter-spacing:-.055em}
.vision-world h2 em,.vision-world h3 em{color:var(--vision-accent)}
.vision-intro__statement{width:min(780px,62%);margin:40px 0 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:28px 58px;padding-top:20px;border-top:1px solid var(--vision-line)}
.vision-intro__statement p:first-child{font:300 clamp(21px,2vw,30px)/1.35 Outfit,sans-serif;letter-spacing:-.02em;color:var(--paper)}
.vision-intro__statement p:last-child{color:var(--muted);font-size:14px;line-height:1.75}
.vision-orbit{position:absolute;right:-11vw;top:12%;width:min(56vw,850px);aspect-ratio:1;border:1px solid rgba(114,214,198,.14);border-radius:50%;transform:rotate(-16deg);pointer-events:none}
.vision-orbit:before,.vision-orbit:after{content:'';position:absolute;border:1px solid rgba(114,214,198,.12);border-radius:50%}
.vision-orbit:before{inset:14%}
.vision-orbit:after{inset:31%}
.vision-orbit i{position:absolute;left:50%;top:50%;width:115%;height:22%;border:1px solid rgba(114,214,198,.17);border-radius:50%;transform:translate(-50%,-50%) rotate(var(--orbit-angle));animation:vision-orbit 18s linear infinite}
.vision-orbit i:nth-child(1){--orbit-angle:0deg}
.vision-orbit i:nth-child(2){--orbit-angle:60deg;animation-duration:24s;animation-direction:reverse}
.vision-orbit i:nth-child(3){--orbit-angle:120deg;animation-duration:30s}
.vision-orbit span{position:absolute;left:50%;top:50%;width:13px;height:13px;border-radius:50%;background:var(--vision-accent);box-shadow:0 0 60px 18px rgba(114,214,198,.22);transform:translate(-50%,-50%)}
.vision-scroll-cue{position:absolute;z-index:2;left:var(--gutter);bottom:29px;display:flex;align-items:center;gap:18px;color:var(--muted);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.vision-scroll-cue i{display:block;width:66px;height:1px;background:var(--vision-accent);transform-origin:left;animation:vision-cue 2.2s cubic-bezier(.16,1,.3,1) infinite}

.vision-scene{position:relative;min-height:122svh;overflow:clip;border-top:1px solid rgba(198,217,206,.06)}
.vision-scene__frame{position:sticky;top:0;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:clamp(88px,10svh,130px) 0}
.vision-scene__layout{position:relative;z-index:2;display:grid;align-items:center;gap:clamp(42px,6vw,92px)}
.vision-scene__layout--stage,.vision-scene__layout--reverse,.vision-scene__layout--finance,.vision-scene__layout--portal{grid-template-columns:minmax(250px,.7fr) minmax(0,1.55fr)}
.vision-scene__layout--reverse{grid-template-columns:minmax(0,1.55fr) minmax(250px,.7fr)}
.vision-copy{position:relative;z-index:3;max-width:460px}
.vision-index{margin-bottom:27px;color:var(--vision-accent);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.vision-copy h3{font-size:clamp(42px,5vw,76px);line-height:.95;letter-spacing:-.05em}
.vision-copy>p:not(.vision-index):not(.vision-aside){max-width:395px;margin-top:28px;color:var(--muted);font-size:15px;line-height:1.75}
.vision-aside{margin-top:32px;padding:18px 0 0 22px;border-left:1px solid var(--vision-accent);font:300 19px/1.45 Outfit,sans-serif;color:var(--paper)}
.vision-parallax{--vision-y:0px;--vision-tilt:0deg;will-change:transform;transform:translate3d(0,var(--vision-y),0) rotateY(var(--vision-tilt));transform-style:preserve-3d}
.vision-screen{position:relative;overflow:hidden;border:1px solid rgba(244,241,234,.28);border-radius:5px;background:#f4f1ea;box-shadow:0 35px 100px rgba(0,0,0,.48),0 0 0 1px rgba(114,214,198,.05);transform:translateZ(0)}
.vision-screen:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.16),transparent 28%);mix-blend-mode:screen}
.vision-screen img{width:100%;height:auto;background:#f4f1ea}
.vision-screen figcaption{position:absolute;left:12px;bottom:12px;z-index:2;padding:8px 11px;border:1px solid rgba(198,217,206,.18);border-radius:2px;background:rgba(3,9,11,.88);color:var(--muted);font-size:9px;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px)}
.vision-stage__visual{perspective:1400px}
.vision-stage__visual .vision-screen{transform:rotateY(-5deg) rotateX(2deg);transform-origin:left center}
.vision-scene--stage{background:radial-gradient(circle at 78% 50%,rgba(114,214,198,.1),transparent 40%),#061113}

.vision-scene--constellation{min-height:145svh;background:linear-gradient(145deg,#03090b 0%,#09191a 55%,#03090b 100%)}
.vision-scene__layout--constellation{grid-template-columns:.65fr 1.45fr}
.vision-stack{position:relative;min-height:min(52vw,710px);perspective:1500px}
.vision-stack .vision-card{position:absolute;width:76%}
.vision-card--order{left:0;top:3%}
.vision-card--order .vision-screen{transform:rotateY(7deg) rotateZ(-1deg);transform-origin:right center}
.vision-card--decision{right:0;bottom:1%;z-index:2}
.vision-card--decision .vision-screen{transform:rotateY(-7deg) rotateZ(1.5deg);transform-origin:left center}

.vision-scene--work{min-height:150svh;background:radial-gradient(circle at 24% 52%,rgba(114,214,198,.1),transparent 38%),#050d0f}
.vision-scene__layout--work{grid-template-columns:1.45fr .64fr}
.vision-scene__layout--work .vision-copy{grid-column:2;grid-row:1}
.vision-work__cards{grid-column:1;grid-row:1;position:relative;min-height:min(54vw,720px);perspective:1500px}
.vision-work__cards .vision-card{position:absolute;width:82%}
.vision-card--home{left:0;top:0}
.vision-card--home .vision-screen{transform:rotateY(7deg) rotateZ(-1deg);transform-origin:right center}
.vision-card--inbox{right:0;bottom:0;z-index:2}
.vision-card--inbox .vision-screen{transform:rotateY(-7deg) rotateZ(1.2deg);transform-origin:left center}

.vision-scene--reconcile{background:radial-gradient(ellipse at 25% 55%,rgba(114,214,198,.08),transparent 44%),#040c0e}
.vision-scene__layout--reverse .vision-stage__visual{grid-column:1}
.vision-scene__layout--reverse .vision-stage__visual .vision-screen{transform:rotateY(5deg) rotateX(1deg);transform-origin:right center}
.vision-scene__layout--reverse .vision-copy{grid-column:2}

.vision-scene--planning{min-height:150svh;background:linear-gradient(145deg,#03090b 0%,#081718 58%,#03090b 100%)}
.vision-scene__layout--planning{grid-template-columns:.64fr 1.45fr}
.vision-plan__cards{position:relative;min-height:min(54vw,720px);perspective:1500px}
.vision-plan__cards .vision-card{position:absolute;width:82%}
.vision-card--demand{right:0;top:0}
.vision-card--demand .vision-screen{transform:rotateY(-7deg) rotateZ(1deg);transform-origin:left center}
.vision-card--supply{left:0;bottom:0;z-index:2}
.vision-card--supply .vision-screen{transform:rotateY(7deg) rotateZ(-1.2deg);transform-origin:right center}

.vision-scene--facts{min-height:135svh;background:radial-gradient(ellipse at 24% 48%,rgba(114,214,198,.1),transparent 42%),#040c0e}
.vision-scene__layout--facts{grid-template-columns:1.5fr .62fr}
.vision-scene__layout--facts .vision-copy{grid-column:2;grid-row:1}
.vision-facts__visual{grid-column:1;grid-row:1;perspective:1500px}
.vision-facts__visual .vision-screen{transform:rotateY(5deg) rotateX(1deg);transform-origin:right center;box-shadow:-24px 32px 0 rgba(114,214,198,.05),0 42px 120px rgba(0,0,0,.52)}

.vision-scene--finance{background:#071214}
.vision-finance__halo{position:absolute;width:min(70vw,1000px);aspect-ratio:1;right:-12%;top:50%;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle,rgba(239,198,155,.12),rgba(114,214,198,.04) 36%,transparent 68%);pointer-events:none}
.vision-finance__visual{perspective:1400px}
.vision-finance__visual .vision-screen{transform:rotateY(-6deg) rotateX(2deg);transform-origin:left center;box-shadow:24px 32px 0 rgba(114,214,198,.055),0 42px 120px rgba(0,0,0,.52)}

.vision-scene--change{min-height:150svh;background:linear-gradient(180deg,#03090b,#081819 48%,#03090b)}
.vision-scene__layout--change{grid-template-columns:.62fr 1.5fr}
.vision-change__cards{position:relative;min-height:min(55vw,760px);perspective:1600px}
.vision-change__cards .vision-card{position:absolute;width:80%}
.vision-card--product{left:0;top:0}
.vision-card--product .vision-screen{transform:rotateY(8deg) rotateZ(-1.5deg);transform-origin:right center}
.vision-card--change{right:0;bottom:0;z-index:2}
.vision-card--change .vision-screen{transform:rotateY(-8deg) rotateZ(1deg);transform-origin:left center}

.vision-scene--movement{min-height:150svh;background:linear-gradient(180deg,#03090b,#071617 52%,#03090b)}
.vision-scene__layout--movement{grid-template-columns:.64fr 1.45fr}
.vision-movement__visual{position:relative;min-height:min(54vw,720px);perspective:1600px}
.vision-movement__visual .vision-card{position:absolute}
.vision-card--transport{right:0;top:0;width:90%}
.vision-card--transport .vision-screen{transform:rotateY(-6deg) rotateX(1deg);transform-origin:left center}
.vision-card--picking{left:2%;bottom:0;z-index:3;width:29%}
.vision-card--picking .vision-screen{padding:6px;border-radius:25px;background:#020708;box-shadow:0 34px 95px rgba(0,0,0,.62),0 0 0 7px rgba(114,214,198,.045);transform:rotateY(8deg) rotateZ(-1.5deg);transform-origin:right bottom}
.vision-card--picking .vision-screen img{border-radius:18px}
.vision-card--picking .vision-screen figcaption{left:10px;right:10px;bottom:10px;text-align:center}

.vision-scene--field{min-height:135svh;background:radial-gradient(circle at 27% 50%,rgba(114,214,198,.11),transparent 32%),#061113}
.vision-scene__layout--field{grid-template-columns:.8fr 1fr;max-width:1100px}
.vision-device{position:relative;justify-self:center;align-self:center;width:min(320px,70vw);height:max-content;padding:10px;border:1px solid rgba(244,241,234,.32);border-radius:38px;background:#020708;box-shadow:0 45px 120px rgba(0,0,0,.58),0 0 0 8px rgba(114,214,198,.04)}
.vision-device:before{content:'';position:absolute;z-index:2;left:50%;top:13px;width:66px;height:6px;border-radius:99px;background:#020708;transform:translateX(-50%)}
.vision-device img{width:100%;height:auto;aspect-ratio:390/844;object-fit:contain;border-radius:28px;background:var(--paper)}
.vision-field__rings{position:absolute;left:23%;top:50%;width:min(48vw,680px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none}
.vision-field__rings i{position:absolute;inset:var(--ring);border:1px solid rgba(114,214,198,.12);border-radius:50%}
.vision-field__rings i:nth-child(1){--ring:0}
.vision-field__rings i:nth-child(2){--ring:18%}
.vision-field__rings i:nth-child(3){--ring:36%}

.vision-scene--portal{background:radial-gradient(circle at 78% 46%,rgba(114,214,198,.08),transparent 40%),#03090b}
.vision-portal__visual{perspective:1400px}
.vision-portal__visual .vision-screen{transform:rotateY(-5deg);transform-origin:left center}

.vision-outro{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:130px 0;background:#061113;text-align:center}
.vision-outro__beam{position:absolute;inset:-20% 0 0;background:conic-gradient(from 160deg at 50% 0%,transparent,rgba(114,214,198,.13) 18deg,transparent 42deg);mask-image:linear-gradient(#000,transparent 78%)}
.vision-outro .wrap{position:relative;z-index:2}
.vision-outro .vision-kicker{justify-content:center}
.vision-outro h2{max-width:1100px;margin:40px auto 0;font-size:clamp(48px,7vw,104px);line-height:.94}
.vision-outro .wrap>p:not(.vision-kicker){max-width:650px;margin:44px auto 30px;color:var(--muted);font-size:14px}
.vision-outro .text-link{color:var(--paper)}

.vision-world [data-vision-reveal]{opacity:0;transition:opacity .9s cubic-bezier(.16,1,.3,1),transform 1.05s cubic-bezier(.16,1,.3,1)}
.vision-world [data-vision-reveal=up]{transform:translate3d(0,54px,0)}
.vision-world [data-vision-reveal=left]{transform:translate3d(-54px,18px,0)}
.vision-world [data-vision-reveal=right]{transform:translate3d(54px,18px,0)}
.vision-world [data-vision-reveal].is-visible{opacity:1;transform:translate3d(0,0,0)}
@keyframes vision-orbit{to{transform:translate(-50%,-50%) rotate(calc(var(--orbit-angle) + 360deg))}}
@keyframes vision-cue{0%,100%{transform:scaleX(.18);opacity:.45}50%{transform:scaleX(1);opacity:1}}

@media(max-width:1050px){
  .vision-scene__layout--stage,.vision-scene__layout--reverse,.vision-scene__layout--finance,.vision-scene__layout--portal{grid-template-columns:minmax(220px,.65fr) minmax(0,1.4fr);gap:38px}
  .vision-scene__layout--reverse{grid-template-columns:minmax(0,1.4fr) minmax(220px,.65fr)}
  .vision-scene__layout--constellation,.vision-scene__layout--change,.vision-scene__layout--work,.vision-scene__layout--planning,.vision-scene__layout--facts,.vision-scene__layout--movement{grid-template-columns:1fr}
  .vision-scene__layout--constellation .vision-copy,.vision-scene__layout--change .vision-copy,.vision-scene__layout--work .vision-copy,.vision-scene__layout--planning .vision-copy,.vision-scene__layout--facts .vision-copy,.vision-scene__layout--movement .vision-copy{grid-column:auto;grid-row:auto;max-width:720px}
  .vision-work__cards,.vision-facts__visual{grid-column:auto;grid-row:auto}
  .vision-stack,.vision-change__cards,.vision-work__cards,.vision-plan__cards,.vision-movement__visual{width:min(900px,100%);min-height:min(66vw,650px);justify-self:center}
}

@media(max-width:700px){
  .vision-header{height:78px;gap:15px}
  .vision-header>p{display:none}
  .vision-header .text-link{margin-left:auto;font-size:11px;gap:10px}
  .vision-brand{width:108px;height:40px}.vision-brand img{width:88px}
  .vision-progress{display:none}
  .vision-intro{min-height:max(760px,100svh);padding:124px 0 90px;align-items:flex-start}
  .vision-gridlines{background-size:46px 46px}
  .vision-orbit{width:126vw;right:-72vw;top:19%}
  .vision-intro h2{font-size:clamp(48px,13.6vw,74px);margin-top:30px;max-width:9ch}
  .vision-intro__statement{width:100%;margin-top:38px;grid-template-columns:1fr;gap:20px;padding-top:20px}
  .vision-intro__statement p:first-child{font-size:22px}
  .vision-scroll-cue{bottom:22px}.vision-scroll-cue span{max-width:170px}
  .vision-scene{min-height:auto}
  .vision-scene__frame{position:relative;min-height:auto;padding:94px 0 108px}
  .vision-scene__layout,.vision-scene__layout--stage,.vision-scene__layout--reverse,.vision-scene__layout--finance,.vision-scene__layout--portal,.vision-scene__layout--field,.vision-scene__layout--work,.vision-scene__layout--planning,.vision-scene__layout--facts,.vision-scene__layout--movement{grid-template-columns:1fr;gap:52px}
  .vision-scene__layout--reverse .vision-stage__visual,.vision-scene__layout--reverse .vision-copy{grid-column:auto}
  .vision-scene__layout--reverse .vision-copy{grid-row:1}
  .vision-copy h3{font-size:clamp(42px,12vw,62px)}
  .vision-copy>p:not(.vision-index):not(.vision-aside){font-size:14px}
  .vision-screen figcaption{position:relative;left:auto;bottom:auto;border:0;border-top:1px solid rgba(198,217,206,.15);border-radius:0;background:#071214;padding:10px 12px;backdrop-filter:none}
  .vision-stage__visual .vision-screen,.vision-scene__layout--reverse .vision-stage__visual .vision-screen,.vision-finance__visual .vision-screen,.vision-portal__visual .vision-screen,.vision-facts__visual .vision-screen{transform:none}
  .vision-stack,.vision-change__cards,.vision-work__cards,.vision-plan__cards,.vision-movement__visual{width:calc(100% + var(--gutter));margin-left:calc(-.5 * var(--gutter));min-height:520px}
  .vision-stack .vision-card,.vision-change__cards .vision-card,.vision-work__cards .vision-card,.vision-plan__cards .vision-card{width:90%}
  .vision-card--order,.vision-card--product,.vision-card--home,.vision-card--supply{top:0;left:0}
  .vision-card--decision,.vision-card--change,.vision-card--inbox,.vision-card--demand{bottom:0;right:0;top:auto}
  .vision-card--order .vision-screen,.vision-card--product .vision-screen,.vision-card--home .vision-screen,.vision-card--supply .vision-screen{transform:rotateZ(-1.5deg)}
  .vision-card--decision .vision-screen,.vision-card--change .vision-screen,.vision-card--inbox .vision-screen,.vision-card--demand .vision-screen{transform:rotateZ(1.5deg)}
  .vision-movement__visual{min-height:500px}
  .vision-card--transport{top:0;right:0;width:96%}
  .vision-card--transport .vision-screen{transform:rotateZ(1deg)}
  .vision-card--picking{left:2%;bottom:0;width:42%}
  .vision-card--picking .vision-screen{transform:rotateZ(-1.5deg)}
  .vision-card--picking .vision-screen figcaption{position:absolute;border:1px solid rgba(198,217,206,.18);border-radius:2px;background:rgba(3,9,11,.88);padding:7px 8px}
  .vision-scene--constellation,.vision-scene--change,.vision-scene--work,.vision-scene--planning,.vision-scene--facts,.vision-scene--movement{min-height:auto}
  .vision-finance__halo{width:140vw;right:-70vw}
  .vision-scene__layout--field .vision-copy{grid-row:1}
  .vision-device{grid-row:2;width:min(290px,78vw)}
  .vision-field__rings{left:50%;top:68%;width:130vw}
  .vision-outro{min-height:max(700px,100svh);padding:110px 0}
  .vision-outro h2{font-size:clamp(45px,12.4vw,66px)}
}

html[data-reduced-motion=true] .vision-world [data-vision-reveal],html[data-reduced-motion=true] .vision-parallax{opacity:1;transform:none;transition:none;will-change:auto}
html[data-reduced-motion=true] .vision-orbit i,html[data-reduced-motion=true] .vision-scroll-cue i{animation:none}
html[data-reduced-motion=true] .vision-progress i:after{transition:none}
@media(prefers-reduced-motion:reduce){
  .vision-world [data-vision-reveal],.vision-parallax{opacity:1;transform:none;transition:none;will-change:auto}
  .vision-orbit i,.vision-scroll-cue i{animation:none}
  .vision-progress i:after{transition:none}
}
