*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{padding:0 28px;background:#0b100d}main,.workflow-header{width:100%;max-width:1140px;margin:auto}.workflow-header{height:96px;display:flex;align-items:center;justify-content:space-between}.workflow-header img{display:block;width:120px;height:auto}.workflow-header nav{display:flex;gap:28px;font-size:14px}.workflow-header a{text-decoration:none}.workflow-hero{position:relative;padding:82px 0 68px;isolation:isolate}.workflow-hero:before{content:'';position:absolute;inset:0 -20px -30px;z-index:-1;background-image:radial-gradient(#9bc5b52e .8px,transparent .8px);background-size:8px 8px;mask-image:radial-gradient(ellipse at 40% 40%,black,transparent 70%)}.eyebrow,.step-number{font:12px/1.5 ui-monospace,monospace;letter-spacing:.08em;color:#9bc5b5}.workflow-hero h1{font-size:clamp(40px,5.8vw,72px);line-height:1.06;letter-spacing:-.045em;margin:24px 0}.workflow-hero h1 span{color:#9bc5b5}.workflow-intro{font-size:20px;margin:26px 0 36px;max-width:590px}.workflow-index{display:flex;gap:12px;flex-wrap:wrap}.workflow-index a{border:1px solid #32463a;border-radius:8px;padding:13px 16px;text-decoration:none;font-size:14px;display:flex;gap:14px;align-items:center;background:#101a13;min-height:48px}.workflow-index a:hover{border-color:#9bc5b5;background:#19291f}.workflow-index span{font:11px ui-monospace,monospace;color:#94ac9e}.workflow-step{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:64px;padding:66px 0;border-top:1px solid #2a382f}.step-copy h2,.keep-heading h2{font-size:clamp(30px,3.6vw,44px);line-height:1.13;margin:16px 0 24px;letter-spacing:-.035em}.step-copy>p:not(.step-number){font-size:18px;line-height:1.65;max-width:380px}.step-copy strong{color:#edf2ee;font-weight:500}.step-copy .quiet{font-size:15px!important;color:#96aa9b}.product-stage{margin:0;min-width:0;padding:26px 30px 20px;border:1px solid #3b5345;border-radius:18px;background:#15261c;overflow:hidden;box-shadow:0 24px 70px #0003}.stage-label{font:12px/1.5 ui-monospace,monospace;color:#c6d9cd;margin-bottom:24px;display:flex;align-items:center;gap:10px}.status-dot{width:6px;height:6px;border-radius:50%;background:#b3d9c8}.scan-stage{background:linear-gradient(140deg,#102119e6,#102119b3),url('/assets/source-landscape.webp') center/cover}.product-stage img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid #53665a;box-shadow:0 18px 42px #0005}.scan-capture{max-width:420px;margin:0 auto}.product-stage figcaption{font-size:12px;text-align:center;margin-top:19px;color:#bfd0c5}.explore-step .step-copy{order:2}.explore-step .product-stage{order:1}.explore-step{grid-template-columns:1.2fr .8fr}.assets-capture{max-width:460px;margin:auto}.explore-stage{background-image:radial-gradient(#9bc5b521 .7px,transparent .7px);background-size:7px 7px}.keep-step{padding:70px 0;border-top:1px solid #2a382f}.keep-heading{max-width:720px;margin-bottom:36px}.keep-heading>p:last-child{font-size:18px;max-width:570px}.outcome-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.outcome{display:flex;flex-direction:column;border:1px solid #344b3c;border-radius:16px;overflow:hidden;background:#142019}.outcome-copy{padding:28px 28px 16px}.outcome h3{font-size:24px;line-height:1.2;font-weight:500;color:#edf2ee;margin:0 0 12px}.outcome-copy p{margin:0;color:#acbfb2;font-size:16px}.outcome-visual{padding:12px 20px 20px;display:flex;align-items:center;flex:1}.outcome-visual img{display:block;width:100%;height:auto;border:1px solid #47594e;border-radius:10px}.collection-detail{font-size:13px;margin:0;padding:0 28px 24px;color:#c3dccd}.collection-detail span{display:block;color:#91a798;margin-top:3px}.workflow-cta{border-top:1px solid #2a382f;padding:64px 0;text-align:center}.workflow-cta h2{font-size:32px;margin:0 0 28px}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.action{display:inline-flex;min-height:48px;align-items:center;padding:0 28px;border:1px solid #b3d9c8;border-radius:8px;background:#b3d9c8;color:#10261a;text-decoration:none;font-size:15px;font-weight:600}.action.secondary{background:#1c2720;color:#e4eee7;border-color:#344339}footer{border-top:1px solid #2a382f;padding:28px 0 40px;color:#91a798;font-size:12px}footer p{max-width:720px}.footer-links{display:flex;gap:24px;flex-wrap:wrap;margin-top:25px}.footer-links span{margin-left:auto}a:focus-visible{outline:2px solid #b3d9c8;outline-offset:5px}@media(max-width:760px){body{padding:0 20px}.workflow-header{height:80px}.workflow-header nav{gap:18px}.workflow-hero{padding:44px 0}.workflow-hero h1{font-size:44px}.workflow-intro{font-size:18px}.workflow-index{display:grid;gap:8px}.workflow-index a{font-size:14px}.workflow-step,.explore-step{grid-template-columns:1fr;gap:24px;padding:40px 0}.explore-step .step-copy,.explore-step .product-stage{order:initial}.step-copy>p:not(.step-number){max-width:100%;font-size:17px}.product-stage{padding:20px 16px 16px}.stage-label{font-size:11px;margin-bottom:18px}.keep-step{padding:40px 0}.outcome-grid{grid-template-columns:1fr;gap:20px}.outcome-copy{padding:24px 22px 12px}.workflow-cta{padding:44px 0}.workflow-cta h2{font-size:28px}.footer-links span{margin-left:0;width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Keep complete UI details inside a padded frame instead of rounding tight crops. */
.product-stage img,.outcome-visual img{padding:18px;background:#141b16;object-fit:contain;object-position:center;border-radius:12px}
.outcome-visual{align-items:flex-start;padding:16px 28px 24px;flex:0 0 auto}
.outcome-copy{min-height:132px}
.collection-detail{margin-top:auto}
@media(max-width:760px){.product-stage img,.outcome-visual img{padding:14px}.outcome-visual{padding:14px 22px 22px}.outcome-copy{min-height:0}}

/* Separate the frame from the crop so rounded corners never cover UI labels. */
.ui-frame{width:100%;padding:18px;border:1px solid #47594e;border-radius:12px;background:#141b16;margin:0 auto}
.product-stage .ui-frame{box-shadow:0 18px 42px #0005}
.ui-crop{overflow:hidden}
.product-stage .ui-frame img,.outcome-visual .ui-frame img{display:block;width:100%;max-width:none;height:auto;padding:0;border:0;border-radius:0;box-shadow:none;background:none}
.download-visual .ui-frame img{width:100%}
.outcome-visual{align-items:flex-start;padding:16px 28px 24px;flex:0 0 auto}
.outcome-copy{min-height:132px}
.collection-detail{margin-top:auto}
@media(max-width:760px){.ui-frame{padding:14px}.outcome-visual{padding:14px 22px 22px}.outcome-copy{min-height:0}}
