/* AENV workflow: native scroll maps the curve, camera and content layers. */
.workflow-story { --workflow-ink:var(--aenv-foreground); --workflow-muted:color-mix(in srgb,var(--aenv-foreground) 68%,var(--aenv-background)); --workflow-line:color-mix(in srgb,var(--aenv-violet-soft) 25%,transparent); --workflow-surface:color-mix(in srgb,var(--aenv-foreground) 4%,var(--aenv-background)); }
.workflow-story__stage { position:relative; padding:2rem 0; isolation:isolate; overflow:visible; }
.workflow-story[data-enhanced] .workflow-story__stage { padding:0; }
.workflow-story__camera { position:relative; z-index:1; padding:2rem 0; }
.workflow-story__curve-window { position:absolute; z-index:0; left:50%; top:-6rem; bottom:-6rem; width:100vw; transform:translateX(-50%); overflow:hidden; pointer-events:none; }
.workflow-story__route { display:none; position:absolute; inset:0; width:100%; height:100%; overflow:visible; transform-origin:50% 50%; pointer-events:none; z-index:0; }
.workflow-story[data-enhanced] .workflow-story__route { display:block; }
.workflow-story__track,.workflow-story__beam { fill:none; stroke-linecap:round; stroke-linejoin:round; }
.workflow-story__track { stroke:var(--aenv-violet-soft); stroke-width:18; }
.workflow-story__beam { stroke:var(--aenv-cyan-soft); stroke-width:6; opacity:0; }
.workflow-story__head { fill:var(--aenv-foreground); opacity:0; }
.workflow-story__head-core { fill:var(--aenv-foreground); }
.workflow-story__cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); justify-items:stretch; gap:clamp(1rem,2vw,1.5rem); position:relative; z-index:1; }
.workflow-story__card { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:14.5rem 1fr; width:100%; min-width:0; position:relative; border:1px solid var(--workflow-line); border-radius:1.1rem; background:color-mix(in srgb,var(--aenv-background) 97%,var(--aenv-violet-soft)); transform-origin:50% 0; }
.workflow-story[data-enhanced] .workflow-story__card { will-change:transform,opacity; }
.workflow-story[data-layout="accumulate"] .workflow-story__camera { min-height:40rem; }
.workflow-story__art { appearance:none; position:relative; display:grid; place-items:center; width:100%; height:14.5rem; padding:3.5rem 1rem 1rem; border:0; border-radius:1.1rem 1.1rem 0 0; color:var(--workflow-ink); background:transparent; font:inherit; text-align:left; isolation:isolate; }
.workflow-story__art::before { content:''; position:absolute; inset:0; border-radius:inherit; background-image:radial-gradient(var(--workflow-line) .6px,transparent .6px); background-size:16px 16px; opacity:.35; pointer-events:none; }
.workflow-story__card[data-current] { border-color:color-mix(in srgb,var(--aenv-cyan-soft) 64%,transparent); box-shadow:0 0 32px color-mix(in srgb,var(--aenv-violet-soft) 10%,transparent); }
.workflow-story__card[data-activated] { border-color:color-mix(in srgb,var(--aenv-cyan-soft) 40%,var(--workflow-line)); }
.workflow-story__cap { position:absolute; top:1.15rem; left:1rem; right:1rem; display:flex; justify-content:space-between; align-items:center; gap:.5rem; z-index:3; font:.62rem var(--font-mono,monospace); letter-spacing:.035em; color:var(--workflow-muted); }
.workflow-story__cap small { color:var(--aenv-violet-soft); font:inherit; font-size:.55rem; }
.workflow-story__glow { position:absolute; inset:-1px; border-radius:inherit; background:radial-gradient(ellipse at 50% 10%,color-mix(in srgb,var(--aenv-cyan-soft) 28%,transparent),color-mix(in srgb,var(--aenv-violet-soft) 12%,transparent) 40%,transparent 74%); pointer-events:none; opacity:0; }
.workflow-story__impact { display:block; position:absolute; z-index:2; width:8rem; height:8rem; left:calc(50% - 4rem); top:calc(55% - 4rem); border:1px solid var(--aenv-cyan-soft); border-radius:50%; box-shadow:0 0 24px color-mix(in srgb,var(--aenv-cyan-soft) 30%,transparent); opacity:0; pointer-events:none; }
.workflow-story__illustration { position:relative; z-index:3; width:100%; max-width:18rem; min-width:0; pointer-events:none; transform-origin:50% 55%; }
.workflow-story__files { display:grid; gap:.5rem; position:relative; }
.workflow-story__library { gap:.35rem; }
.workflow-story__library-title { display:flex; align-items:center; gap:.45rem; margin-bottom:.15rem; font-size:.7rem; color:var(--aenv-violet-soft); }
.workflow-story__library-title svg { width:1rem; height:1rem; flex:none; }
.workflow-story__library .workflow-story__file { padding-block:.2rem; }
.workflow-story__library .workflow-story__file-icon { height:1.6rem; }
.workflow-story__file { display:grid; grid-template-columns:2rem minmax(0,1fr) auto; align-items:center; gap:.65rem; padding:.4rem .65rem; border:1px solid color-mix(in srgb,var(--aenv-foreground) 14%,transparent); border-radius:.5rem; background:color-mix(in srgb,var(--aenv-background) 93%,var(--aenv-violet-soft)); box-shadow:0 5px 12px color-mix(in srgb,var(--aenv-background) 50%,transparent); font-size:.68rem; line-height:1.3; }
.workflow-story__file-icon { width:1.7rem; height:2rem; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--aenv-violet-soft) 44%,transparent); border-radius:.3rem; font:.5rem var(--font-mono,monospace); color:var(--aenv-violet-soft); background:color-mix(in srgb,var(--aenv-violet-soft) 8%,transparent); }
.workflow-story__file-name { display:block; font:.68rem/1.3 var(--font-mono,monospace); color:var(--workflow-ink); white-space:nowrap; }
.workflow-story__file-meta { display:block; color:var(--workflow-muted); font-size:.58rem; line-height:1.5; margin-top:.1rem; }
.workflow-story__file-state { width:.35rem; height:.35rem; border-radius:50%; background:var(--aenv-cyan-soft); }
.workflow-story__scan { position:absolute; z-index:4; height:2px; top:50%; left:-.6rem; right:-.6rem; opacity:0; background:var(--aenv-cyan-soft); box-shadow:0 0 16px 4px color-mix(in srgb,var(--aenv-cyan-soft) 28%,transparent); }
.workflow-story__scope { padding:.8rem; border:1px solid color-mix(in srgb,var(--aenv-violet-soft) 42%,transparent); border-radius:.65rem; background:var(--aenv-background); box-shadow:0 12px 26px color-mix(in srgb,var(--aenv-background) 65%,transparent); font-size:.68rem; line-height:1.4; }
.workflow-story__scope-title { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding-bottom:.8rem; border-bottom:1px solid var(--workflow-line); font-size:.72rem; }
.workflow-story__scope-title span { color:var(--workflow-muted); font:.52rem var(--font-mono,monospace); }
.workflow-story__scope-row { display:flex; align-items:center; gap:.65rem; margin-top:.6rem; font:.68rem var(--font-mono,monospace); }
.workflow-story__scope-row > svg { width:1rem; height:1rem; flex:none; color:var(--aenv-cyan-soft); }
.workflow-story__scope-row--muted { color:var(--workflow-muted); }
.workflow-story__scope-row--muted > svg { color:var(--workflow-muted); }
.workflow-story__check { transform-box:fill-box; transform-origin:center; }
.workflow-story__scope-footer { display:flex; justify-content:space-between; gap:.5rem; margin-top:.75rem; padding-top:.6rem; border-top:1px solid var(--workflow-line); font-size:.58rem; color:var(--aenv-cyan-soft); }
.workflow-story__scope-footer span:last-child { color:var(--workflow-muted); }
.workflow-story__status .workflow-story__scope-row { justify-content:space-between; }
.workflow-story__status em { font:inherit; color:var(--aenv-cyan-soft); }
.workflow-story__receipt { position:relative; display:flex; align-items:center; gap:.45rem; width:max-content; max-width:100%; margin-top:.6rem; padding:.4rem .6rem; border:1px solid var(--workflow-line); border-radius:.35rem; background:var(--aenv-background); color:var(--aenv-cyan-soft); font-size:.58rem; line-height:1.4; }
.workflow-story__receipt svg { width:.8rem; height:.8rem; flex:none; }
.workflow-story__copy { position:relative; z-index:5; padding:1.25rem 1.25rem 1.5rem; }
.workflow-story__step { display:block; font:.625rem var(--font-mono,monospace); color:var(--aenv-violet-soft); margin-bottom:.7rem; }
.workflow-story__copy h3 { margin:0 0 .75rem; font-size:1.1rem; line-height:1.4; font-weight:500; letter-spacing:-.025em; }
.workflow-story__copy p { margin:0; font-size:.82rem; line-height:1.8; color:var(--workflow-muted); overflow-wrap:anywhere; }
.workflow-story__caption { max-width:85ch; }
@media (max-width:1050px) and (min-width:761px) { .workflow-story__art { padding-inline:.65rem; } .workflow-story__copy { padding-inline:1rem; } .workflow-story__copy h3 { font-size:1.05rem; } .workflow-story__file { padding:.35rem .45rem; gap:.4rem; grid-template-columns:1.5rem minmax(0,1fr) auto; } .workflow-story__file-icon { width:1.35rem; height:1.75rem; } .workflow-story__file-name { font-size:.57rem; } .workflow-story__scope { padding:.7rem; } .workflow-story__scope-row { font-size:.58rem; gap:.45rem; } .workflow-story__receipt { font-size:.5rem; } }
@media (max-width:760px) { .workflow-story__stage { padding-top:1rem; } .workflow-story__camera { padding:1rem 0; } .workflow-story__cards { grid-template-columns:minmax(0,1fr); gap:2.5rem; justify-items:center; } .workflow-story__card { max-width:30rem; } .workflow-story__track { stroke-width:12; } .workflow-story__beam { stroke-width:4; } .workflow-story__art { padding-inline:1.25rem; } .workflow-story__illustration { max-width:17rem; } .workflow-story__copy { padding:1.25rem 1.5rem 1.5rem; } .workflow-story__copy h3 { font-size:1.25rem; } .workflow-story__copy p { max-width:42ch; } }
@media (max-width:380px) { .workflow-story { padding-inline:1rem; } .workflow-story__art { padding-inline:1rem; } .workflow-story__copy { padding-inline:1.25rem; } .workflow-story__file { padding:.4rem .45rem; gap:.4rem; grid-template-columns:1.75rem minmax(0,1fr) auto; } .workflow-story__file-name { font-size:.61rem; } .workflow-story__scope { padding:.8rem; } }
@media (prefers-reduced-motion:reduce) { .workflow-story *, .workflow-story *::before, .workflow-story *::after { animation:none!important; transition:none!important; } .workflow-story__route { display:none!important; } .workflow-story__card { will-change:auto!important; } .workflow-story__beam,.workflow-story__head,.workflow-story__impact,.workflow-story__glow,.workflow-story__scan { opacity:0!important; } }