/* The product keeps its native proportions; focus moves inside the image. */
.finance-scroll-hint{display:none}
.finance-switch button{position:relative}
.finance-step-progress{position:absolute;bottom:-2px;left:0;right:0;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;pointer-events:none}
.finance-section .finance-stage{grid-template-columns:minmax(220px,.65fr) minmax(0,1.6fr);gap:40px}
.finance-visual{min-width:0;width:100%}
.finance-canvas{width:100%;min-width:0}
.finance-product{width:100%;max-width:1000px;margin:auto}
.finance-section .finance-screen{display:block;position:relative;isolation:isolate;padding:0;margin:auto;width:100%;max-width:1000px;height:auto;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel);box-shadow:0 20px 60px #0003}
.finance-section .finance-screen picture{display:block;width:100%;height:auto;aspect-ratio:auto;overflow:visible}
.finance-section .finance-screen picture img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:0}
.finance-dimmer,.finance-focus-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.finance-dimmer{background:#04070687;clip-path:polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,1% 6%,1% 21%,49% 21%,49% 6%,1% 6%);transition:clip-path 600ms var(--ease-in-out),opacity 200ms ease}
.finance-focus-frame{overflow:visible;color:var(--marker-green,var(--lime))}
.finance-focus-frame rect{transform-box:view-box;transform-origin:0 0;transform:translate(1%,6%) scale(.48,.15);transition:transform 600ms var(--ease-in-out)}
.finance-callout{position:absolute;left:2%;top:23%;max-width:64%;padding:8px 10px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:3px;box-shadow:0 5px 16px #0002;font-size:clamp(12px,1vw,14px);line-height:1.4;pointer-events:none;text-align:left}
.finance-callout::before{content:"";position:absolute;bottom:100%;left:16px;height:12px;width:1px;background:var(--marker-green,var(--lime))}
.finance-callout .brand-marker{white-space:normal}
.finance-screen-caption{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:12px;color:var(--muted);line-height:1.5;margin-top:12px}
.finance-screen-caption>span:last-child{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.finance-screen-caption .ui-arrow{width:14px;height:14px}
.finance-section .finance-context{min-width:0}
.finance-section .finance-context h3{font-size:clamp(24px,2.1vw,32px);line-height:1.16;letter-spacing:-.035em;margin:12px 0}
.finance-section .finance-context #finance-description{font-size:15px;line-height:1.6}
.finance-section .finance-context .demo-disclaimer{font-size:10px;line-height:1.6;max-width:310px}
.finance-section[data-finance-active="1"] .finance-callout{top:56%;left:2%}
.finance-section[data-finance-active="1"] .finance-callout::before{top:100%;bottom:auto}
.finance-section[data-finance-active="2"] .finance-callout{top:45%;left:22%}
.finance-section[data-finance-active="3"] .finance-callout{top:43%;left:2%}
.finance-section[data-finance-active="3"] .finance-callout::before{top:100%;bottom:auto}
.finance-section[data-finance-input="keyboard"] .finance-dimmer,.finance-section[data-finance-input="keyboard"] .finance-focus-frame rect{transition:none}
.finance-screen.is-image-loading .finance-dimmer,.finance-screen.is-image-loading .finance-focus-frame,.finance-screen.is-image-loading .finance-callout{visibility:hidden}
.finance-section.is-scroll-story{height:350svh;padding-block:0;position:relative;overflow:visible}
.finance-section.is-scroll-story .finance-pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;padding:clamp(18px,2.5svh,32px) 0;min-height:0}
.is-scroll-story .finance-static-hint{display:none}.is-scroll-story .finance-scroll-hint{display:inline}
.finance-section.is-scroll-story .section-top{margin-bottom:14px;flex:none}
.finance-section.is-scroll-story .section-top .eyebrow{font-size:10px;letter-spacing:1.2px}
.finance-section.is-scroll-story .section-note{font-size:10px;letter-spacing:1px}
.finance-section.is-scroll-story .finance-heading{flex:none;gap:40px;margin-bottom:14px;align-items:center}
.finance-section.is-scroll-story .finance-heading h2{font-size:clamp(32px,3vw,46px);line-height:1.06;margin:0}
.finance-section.is-scroll-story .finance-heading .product-lead{font-size:15px;line-height:1.5;margin:0;max-width:460px}
.finance-section.is-scroll-story .finance-switch{flex:none}
.finance-section.is-scroll-story .finance-switch button{padding:12px 10px;border-bottom-color:transparent}
.finance-section.is-scroll-story .finance-switch button[aria-pressed=true]{color:var(--lime)}
.finance-section.is-scroll-story .finance-stage{flex:1;min-height:0;align-items:center;padding:20px 0 14px}
.finance-section.is-scroll-story .finance-visual{height:100%;min-height:0}
.finance-section.is-scroll-story .finance-canvas{container-type:size;display:grid;place-items:center;min-height:0;height:100%}
.finance-section.is-scroll-story .finance-product{width:min(100cqw,calc((100cqh - 30px) * 1.32))}
.finance-section.is-scroll-story .finance-screen{width:100%;height:auto;max-height:none;flex:none}
.finance-section.is-scroll-story .finance-context .eyebrow{font-size:10px;margin:0}
.finance-section.is-scroll-story .finance-context-line{margin:18px 0}
.finance-section.is-scroll-story .finance-context #finance-description{margin:0;font-size:16px}
.finance-section.is-scroll-story .finance-proof{flex:none;padding-top:12px;font-size:10px;gap:10px}
[data-theme=light] .finance-dimmer{background:#111b1757}
[data-theme=light] .finance-focus-frame{color:#527b20}
[data-theme=light] .finance-step-progress{background:#527b20}
[data-theme=light] .finance-section.is-scroll-story .finance-switch button[aria-pressed=true]{color:#527b20}
@supports not (width:1cqw){.finance-section.is-scroll-story .finance-product{width:min(100%,calc((100svh - 275px) * 1.32))}}
@media(max-width:900px){.finance-section .finance-stage{grid-template-columns:minmax(200px,.75fr) minmax(0,1.25fr);gap:25px}.finance-section .finance-context h3{font-size:25px}}
@media(max-width:760px){
 .finance-section .finance-stage{display:flex;flex-direction:column-reverse;gap:22px}
 .finance-section .finance-context{width:100%}
 .finance-section .finance-context h3{font-size:24px}
 .finance-section .finance-context .demo-disclaimer{max-width:none}
 .finance-screen-caption{font-size:10px;gap:8px;margin-top:9px}
 .finance-callout{font-size:11px;padding:5px 7px;max-width:78%}
 .finance-callout::before{height:7px;left:10px}
 .finance-section[data-finance-active="1"] .finance-callout{top:54%}
 .finance-section[data-finance-active="3"] .finance-callout{top:40%}
 .finance-section.is-scroll-story{height:340svh}
 .finance-section.is-scroll-story .finance-pin{padding:16px 0}
 .finance-section.is-scroll-story .section-top{margin-bottom:10px}
 .finance-section.is-scroll-story .finance-heading{margin-bottom:12px;display:block}
 .finance-section.is-scroll-story .finance-heading h2{font-size:clamp(27px,7vw,38px)}
 .finance-section.is-scroll-story .finance-heading .product-lead{display:none}
 .finance-section.is-scroll-story .finance-switch button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 4px;font-size:10px}
 .finance-section.is-scroll-story .finance-switch button span{font-size:12px;margin-left:0}
 .finance-section.is-scroll-story .finance-stage{gap:24px;padding:14px 0;justify-content:center}
 .finance-section.is-scroll-story .finance-visual{flex:none;width:100%;min-height:0;height:auto}
 .finance-section.is-scroll-story .finance-canvas{height:auto;container-type:normal;display:block}
 .finance-section.is-scroll-story .finance-product{width:100%;max-width:min(100%,calc((100svh - 400px) * 1.32))}
 .finance-section.is-scroll-story .finance-context{flex:none;min-height:150px}
 .finance-section.is-scroll-story .finance-context h3{font-size:22px;line-height:1.2;margin:6px 0 8px}
 .finance-section.is-scroll-story .finance-context #finance-description{font-size:14px;line-height:1.5}
 .finance-section.is-scroll-story .finance-context .demo-disclaimer{font-size:9px;line-height:1.4;margin:8px 0 0}
 .finance-section.is-scroll-story .finance-context-line{display:none}
 .finance-section.is-scroll-story .finance-proof{display:none}
}
@media(prefers-reduced-motion:reduce){.finance-dimmer,.finance-focus-frame rect{transition:none!important}}
@media(forced-colors:active){.finance-dimmer,.finance-focus-frame,.finance-callout{display:none}}
