
/* Scoped narrative styles. Recovered React content remains intact behind this page. */
main.ip-paths[data-how-story="ready"] { width:100%; max-width:none; padding:0; margin:0; overflow:visible; }
main.ip-paths[data-how-story="ready"] > :not(.how-story) { display:none !important; }
.how-story {
 --how-ink:#edf1f2; --how-muted:#a5b3bb; --how-line:rgba(177,201,215,.15);
 --how-accent:#abd5ed; color:var(--how-ink); background:transparent;
 font-family:inherit; position:relative; isolation:isolate;
}
.how-story *, .how-story *::before, .how-story *::after { box-sizing:border-box; }
.how-story a { color:inherit; text-decoration:none; }
.how-story button, .how-story input { font:inherit; }
.how-story a:focus-visible, .how-story button:focus-visible, .how-story input:focus-visible,
.how-story summary:focus-visible, .how-service-panel:focus-visible { outline:2px solid var(--how-accent); outline-offset:6px; }
.how-story h1:focus,.how-story h2:focus { outline:none; }
.how-rail { position:sticky; top:0; z-index:10; min-height:64px; display:flex; align-items:center; gap:24px; padding:8px max(5.5vw,24px); background:rgba(9,13,16,.94); backdrop-filter:blur(18px); border-bottom:1px solid var(--how-line); }
.how-rail-label { font-size:12px; white-space:nowrap; letter-spacing:.03em; }
.how-rail-dots { display:flex; flex:1; justify-content:center; align-items:center; gap:8px; }
.how-rail-dots a { width:30px; height:36px; display:grid; place-items:center; position:relative; color:#6d808b; font-size:9px; font-variant-numeric:tabular-nums; transition:color .2s; }
.how-rail-dots a::before { content:''; width:4px; height:4px; position:absolute; bottom:0; border-radius:50%; background:currentColor; }
.how-rail-dots a[aria-current] { color:var(--how-accent); }
.how-rail-dots a:hover { color:#fff; }
.how-motion { background:none; color:var(--how-muted); border:1px solid var(--how-line); border-radius:100px; padding:9px 13px; font-size:10px!important; cursor:pointer; white-space:nowrap; }
.how-progress { position:absolute; height:2px; background:var(--how-accent); inset:auto 0 -1px; transform:scaleX(var(--how-progress,0)); transform-origin:0 50%; pointer-events:none; }
.how-chapter { --how-shift:0; --how-opacity:1; --how-turn:0deg; position:relative; scroll-margin-top:64px; padding:90px max(6.3vw,24px); border-bottom:1px solid var(--how-line); overflow:clip; }
.how-chapter::before { content:''; pointer-events:none; position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse at 80% 50%,rgba(94,150,185,.065),transparent 65%); }
.how-chapter:nth-of-type(3n)::before { background:radial-gradient(ellipse at 70% 50%,rgba(147,126,190,.07),transparent 65%); }
.how-chapter-inner { max-width:1320px; min-height:calc(100svh - 244px); margin:auto; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:7%; align-items:center; }
.how-copy { transform:translate3d(0,calc(var(--how-shift) * 35px),0); opacity:var(--how-opacity); }
.how-scene { min-width:0; transform:translate3d(0,calc(var(--how-shift) * 65px),0) perspective(1200px) rotateX(var(--how-turn)); opacity:var(--how-opacity); transform-origin:center; }
.how-kicker { display:block; color:var(--how-muted); font-size:10px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:26px; line-height:1.5; }
.how-kicker b { color:var(--how-accent); font-weight:500; margin-right:8px; }
.how-copy h1,.how-copy h2 { color:var(--how-ink); font-size:clamp(32px,3.8vw,61px); line-height:1.08; font-weight:500; letter-spacing:-.05em; margin:0 0 27px; }
.how-copy h1 { font-size:clamp(42px,4.6vw,72px); }
.how-copy em { color:#9aadb8; font-style:normal; }
.how-copy > p { color:#b8c5cc; font-size:14px; line-height:1.8; max-width:460px; margin:0 0 18px; }
.how-copy p.how-lead { color:#e5ecef; font-size:20px; letter-spacing:-.02em; }
.how-copy > p.how-note,.how-note { font-size:11px; color:#93a5b0; line-height:1.7; }
.how-copy .how-byline { margin-top:30px; color:#e0e8ec; font-size:12px; }
.how-byline span { color:#8e9da7; font-size:10px; }
.how-text-link { display:inline-flex; gap:24px; align-items:center; font-size:12px; color:#c7e7f6!important; padding:12px 0; }
.how-text-link:hover { color:#fff!important; }
.how-hero-art { aspect-ratio:1; position:relative; display:grid; place-items:center; max-width:580px; margin:auto; }
.how-hero-art img { width:60%; height:auto; filter:drop-shadow(0 0 35px #4b6f8150); transform:translateY(calc(var(--how-shift) * -24px)); }
.how-orbit { position:absolute; width:90%; height:90%; border:1px solid #7ba4b020; border-radius:50%; transform:rotateX(45deg) rotateZ(-25deg); }
.how-orbit-two { width:76%; height:76%; transform:rotateX(56deg) rotateZ(36deg); border-color:#7ba4b035; }
.how-satellite { position:absolute; width:30px; height:30px; border-radius:50%; box-shadow:inset -7px -7px 9px #030b11,0 0 25px #6894c02e; border:1px solid #9cd1eb80; background:radial-gradient(circle at 30% 25%,#b7d6e3,#183c51 25%,#071015 65%,#76bcd7); }
.how-satellite-a { top:18%; left:15%; }.how-satellite-b { bottom:22%; right:12%; filter:hue-rotate(65deg); }.how-satellite-c { top:25%; right:10%; width:22px; height:22px; filter:hue-rotate(125deg); }
.how-hero-caption { position:absolute; bottom:5%; color:#8297a5; font-size:9px; letter-spacing:.13em; text-align:center; }
.how-foundation { perspective:1000px; padding:12px 0; }
.how-foundation-row { padding:19px 22px; display:flex; gap:20px; align-items:start; border-bottom:1px solid #a0c7e31c; background:linear-gradient(105deg,#15202970,#0b111800); transform:translateX(calc(var(--how-shift) * var(--order) * 5px)); }
.how-foundation-row > span { font-size:10px; color:#7395a9; padding-top:4px; }
.how-foundation-row h3,.how-earn-step h3,.how-team h3,.how-delivery h3,.how-market-grid h3 { font-weight:500; color:#e2ebef; font-size:14px; margin:0 0 5px; }
.how-foundation-row p,.how-earn-step p,.how-team p,.how-delivery p,.how-market-grid p { font-size:11px; line-height:1.6; color:#8eabbc; margin:0; }
.how-earn { display:grid; grid-template-columns:repeat(3,1fr); column-gap:18px; }
.how-earn-step { border-top:1px solid #94bdd835; padding-top:20px; }
.how-earn-step > span { display:block; color:#8eb9d0; font-size:11px; margin-bottom:24px; }
.how-earn-step p { max-width:125px; }
.how-bars { grid-column:1/-1; height:210px; display:flex; gap:18px; align-items:end; margin-top:36px; border-bottom:1px solid #4b667c50; }
.how-bars > div { flex:1; height:100%; display:flex; align-items:stretch; position:relative; }
.how-client-stack { width:100%; display:flex; flex-direction:column-reverse; justify-content:flex-start; gap:5px; }
.how-client-block { display:block; height:calc((100% - 20px)/5); width:100%; flex:none; border:1px solid #a9d5e77a; border-radius:2px; background:linear-gradient(110deg,#365b73,#a3cadc 48%,#466e88); box-shadow:inset 0 1px #d9f5ff58,0 0 18px #74c3ed18; }
.how-bars small { position:absolute; bottom:-28px; font-size:10px; color:#8fa7b7; white-space:nowrap; }
.how-diagram-caption { font-size:10px; line-height:1.7; color:#8b9da8; }
.how-earn > .how-diagram-caption { grid-column:1/-1; margin:44px 0 0; }
.how-structure { display:flex; align-items:center; flex-direction:column; padding:25px 0; }
.how-you { font-size:11px; letter-spacing:.14em; text-align:center; }
.how-you small { display:block; color:#8fa9b8; font-size:10px; letter-spacing:0; margin-top:8px; }
.how-connector { height:35px; width:1px; background:#8bb5cb50; }
.how-control { background:#13222b; border:1px solid #79a4bb40; border-radius:13px; padding:20px 24px; display:flex; gap:16px; align-items:center; box-shadow:0 20px 50px #0006; }
.how-control img { width:58px; height:58px; object-fit:contain; }
.how-control strong { display:block; font-weight:500; font-size:15px; }
.how-control span { display:block; color:#8cabbc; font-size:11px; margin-top:7px; }
.how-client-branches { width:100%; display:flex; gap:14px; position:relative; padding-top:54px; }
.how-client-branches::before { content:''; position:absolute; top:29px; left:16.5%; right:16.5%; border-top:1px solid #8bb5cb50; }
.how-client-branches::after { content:''; position:absolute; left:50%; top:0; height:29px; border-left:1px solid #8bb5cb50; }
.how-client-space { flex:1; background:#0d161e; border:1px solid #7b9bac30; border-radius:8px; position:relative; padding:22px 15px; transform:translateY(calc(var(--how-shift) * var(--order) * 12px)); }
.how-client-space::before { content:''; position:absolute; top:-26px; height:25px; left:50%; border-left:1px solid #8bb5cb50; }
.how-client-space strong { font-size:12px; font-weight:500; display:block; margin-bottom:18px; }
.how-client-space span { display:block; font-size:10px; color:#9eb4c1; margin:8px 0; }
.how-plain-list { list-style:none; padding:0; margin:25px 0; }
.how-plain-list li { font-size:12px; color:#aebfc9; padding:10px 0 10px 18px; border-bottom:1px solid #9ebaca1a; position:relative; }
.how-plain-list li::before { content:''; position:absolute; width:4px; height:4px; border-radius:50%; left:0; top:17px; background:#85b6d1; }
.how-team-owner { display:flex; align-items:center; justify-content:center; gap:20px; }
.how-team-owner span { font-size:9px; color:#7f99aa; }
.how-team-owner strong { font-size:12px; font-weight:500; padding:11px 16px; border:1px solid #93b8c83d; border-radius:99px; }
.how-team-lead { text-align:center; margin:28px 0 30px; }
.how-team-lead img { object-fit:contain; width:100px; height:100px; filter:drop-shadow(0 0 20px #94c4dd40); }
.how-team-lead h3 { margin-top:12px; }
.how-team-support { display:grid; grid-template-columns:1fr 1fr; gap:28px 24px; }
.how-team-support > div { display:grid; grid-template-columns:26px 1fr; column-gap:9px; transform:translateY(calc(var(--how-shift) * var(--order) * 10px)); }
.how-team-support p { grid-column:2; }
.how-team-support i { width:19px; height:19px; display:block; border-radius:50%; grid-row:1/3; margin-top:2px; background:radial-gradient(circle at 30% 20%,#9bcce0,#193f5a 25%,#071015 65%,#8ccae7); box-shadow:0 0 16px #749dbd26; }
.how-team-support > div:nth-child(2) i { filter:hue-rotate(60deg); }.how-team-support > div:nth-child(3) i { filter:hue-rotate(125deg); }.how-team-support > div:nth-child(4) i { filter:hue-rotate(-100deg); }
.how-delivery { list-style:none; padding:0; margin:0; }
.how-delivery li { display:flex; align-items:center; gap:22px; padding:24px 20px; border-bottom:1px solid #9ebaca1c; position:relative; transform:translateX(calc(var(--how-shift) * var(--order) * 7px)); }
.how-delivery li > span { font-size:11px; color:#79a1ba; font-variant-numeric:tabular-nums; }
.how-delivery li:nth-child(4) { background:#1b2b3080; border:1px solid #9cc6ca40; border-radius:7px; }
.how-delivery li b { font-size:8px; font-weight:400; letter-spacing:.08em; text-transform:uppercase; color:#b4d8d2; margin-left:auto; white-space:nowrap; }
.how-workflow { grid-column:1/-1; margin-top:18px; border-top:1px solid var(--how-line); border-bottom:1px solid var(--how-line); }
.how-workflow summary { display:flex; justify-content:space-between; gap:25px; cursor:pointer; padding:25px 0; color:#cbdee8; font-size:13px; list-style:none; }
.how-workflow summary::-webkit-details-marker { display:none; }
.how-workflow[open] summary > span:last-child { transform:rotate(45deg); }
.how-workflow-body { padding:15px 0 35px; }
.how-view-key { display:flex; gap:35px; margin-bottom:30px; }
.how-view-key span { font-size:11px; color:#8fa8b7; }
.how-view-key b { display:block; font-size:12px; color:#d7e5ee; margin-bottom:6px; font-weight:500; }
.how-workflow ol { display:grid; grid-template-columns:repeat(5,1fr); gap:24px; list-style:none; padding:0; margin:0 0 20px; }
.how-workflow li { border-top:1px solid #7f9baf50; padding-top:20px; }
.how-workflow li > span { display:block; font-size:9px; text-transform:uppercase; letter-spacing:.08em; color:#83b5d3; margin-bottom:12px; }
.how-workflow h3 { font-size:13px; line-height:1.5; font-weight:500; margin:0 0 12px; }
.how-workflow p { font-size:11px; line-height:1.7; color:#96adbd; margin:0; }
.how-stat-inline { display:flex; gap:24px; align-items:center; margin:30px 0; }
.how-stat-inline strong { font-size:58px; font-weight:400; letter-spacing:-.05em; color:#bbdbe9; white-space:nowrap; }
.how-stat-inline strong span { font-size:24px; }
.how-stat-inline p { font-size:11px; line-height:1.7; color:#9eb6c4; margin:0; max-width:220px; }
.how-copy > p.how-source { font-size:10px; line-height:1.7; color:#819cae; }
.how-source a { display:block; color:#9cc7df; margin-top:6px; text-decoration:underline; text-decoration-color:#8ab4ca50; text-underline-offset:4px; }
.how-market-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.how-market-grid > div { padding:20px; background:linear-gradient(135deg,#132028a0,#0b111560); border:1px solid #8cb7d01f; border-radius:6px; transform:translateY(calc(var(--how-shift) * var(--order) * 3px)); }
.how-market-grid > div > span { display:block; font-size:8px; color:#5f8196; margin-bottom:18px; }
.how-market-grid h3 { font-size:12px; }
.how-market-grid p { font-size:10px; }
.how-service-tabs { display:flex; flex-wrap:wrap; gap:7px; }
.how-service-tabs button { padding:9px 11px; border:1px solid #88abc72e; border-radius:4px; background:#0e171c; color:#8faabb; font-size:10px; cursor:pointer; }
.how-service-tabs button[aria-selected="true"] { color:#e6f3fa; border-color:#95c4dc80; background:#29445770; }
.how-service-panel { padding:30px 30px 25px; margin-top:20px; background:radial-gradient(ellipse at 50% 0%,#3c536d35,transparent 70%),#0d151c; border:1px solid #8cb9d333; border-radius:9px; min-height:325px; }
.how-service-orb { width:50px; height:50px; display:block; border-radius:50%; margin-bottom:24px; background:radial-gradient(circle at 30% 20%,#b5dce8,#285574 28%,#030b14 65%,#67abc6); box-shadow:inset -2px -2px 3px #95cae8,0 0 30px #8bb7d540; }
.how-service-panel[data-role="1"] .how-service-orb { filter:hue-rotate(-45deg); }.how-service-panel[data-role="2"] .how-service-orb { filter:hue-rotate(100deg); }.how-service-panel[data-role="3"] .how-service-orb { filter:hue-rotate(-135deg); }.how-service-panel[data-role="4"] .how-service-orb { filter:hue-rotate(25deg); }
.how-service-panel h3 { font-size:21px; font-weight:500; letter-spacing:-.025em; margin:0 0 14px; }
.how-service-panel p { color:#a2bac9; font-size:12px; line-height:1.7; margin:0; }
.how-service-panel ol { padding:20px 0 0; list-style:none; display:flex; justify-content:space-between; gap:12px; counter-reset:service; }
.how-service-panel li { font-size:9px; line-height:1.6; color:#b6c8d2; flex:1; border-top:1px solid #6992ad60; padding-top:9px; counter-increment:service; }
.how-service-panel li::before { content:'0' counter(service); display:block; color:#6189a2; font-size:8px; margin-bottom:8px; }
.how-calculator { border:1px solid #9cc1d33b; border-radius:10px; padding:32px; background:linear-gradient(145deg,#15232e,#0b1118); }
.how-calc-kicker { color:#8dadc1; font-size:8px; letter-spacing:.12em; display:block; margin-bottom:16px; line-height:1.6; }
#how-revenue { font-size:clamp(40px,4.8vw,70px); color:#d5eaf6; letter-spacing:-.05em; font-weight:400; display:block; margin-bottom:34px; font-variant-numeric:tabular-nums; }
.how-range { margin-top:26px; }
.how-range label { display:flex; justify-content:space-between; gap:12px; color:#a7bccb; font-size:11px; }
.how-range label output { font-weight:500; color:#deedf7; font-variant-numeric:tabular-nums; }
.how-range input { width:100%; accent-color:#9ac6df; height:24px; margin:10px 0 4px; cursor:pointer; }
.how-range > div { display:flex; justify-content:space-between; color:#637f91; font-size:9px; }
.how-equation { text-align:center; font-size:12px; color:#b5cfde; margin:30px 0; }
.how-setup-example { border-top:1px solid #8daecb30; padding-top:20px; display:flex; flex-direction:column; gap:10px; }
.how-setup-example span { font-size:10px; color:#90aabb; }
.how-setup-example strong { font-size:16px; font-weight:400; color:#d1e1eb; }
.how-setup-example small { font-size:9px; line-height:1.6; color:#8099ab; }
.how-opportunity { max-width:460px; margin:auto; }
.how-big-number { font-size:100px; letter-spacing:-.07em; line-height:1; color:#bad4e5; }
.how-big-number > span { display:block; font-size:11px; letter-spacing:0; color:#8ca9bc; margin:14px 0 28px; }
.how-fifty { display:grid; grid-template-columns:repeat(10,1fr); gap:12px; border-bottom:1px solid #7a9caf3d; padding-bottom:30px; }
.how-fifty i { display:block; width:12px; height:12px; border-radius:50%; background:#93bed294; border:1px solid #a8cfdf80; transform:translateY(calc(var(--how-shift) * min(var(--order), 10) * 2px)); }
.how-opportunity-total { display:flex; flex-direction:column; padding-top:26px; gap:8px; }
.how-opportunity-total span { font-size:10px; color:#98b4c5; }
.how-opportunity-total strong { font-size:43px; font-weight:400; color:#c7dce9; letter-spacing:-.04em; }
.how-opportunity .how-diagram-caption { max-width:390px; margin-top:22px; }
.how-handover { padding:28px; border:1px solid #8cabbc30; border-radius:8px; background:#0e171e; }
.how-builds { display:grid; grid-template-columns:1fr 1fr; gap:6px 20px; margin-bottom:24px; }
.how-builds > span { display:flex; align-items:center; gap:10px; padding:13px 0; font-size:11px; color:#b4c8d5; border-bottom:1px solid #91b0c21f; }
.how-builds i { width:5px; height:5px; flex:none; border-radius:50%; background:#8cb5ca; }
.how-button { background:#d2e2eb; color:#15212b!important; border:1px solid #d2e2eb; border-radius:5px; padding:14px 18px; display:inline-flex; justify-content:space-between; align-items:center; gap:28px; font-size:12px; transition:background .2s,transform .2s; }
.how-button:hover { background:#f0f8fc; transform:translateY(-2px); }
.how-handover .how-button { margin-top:10px; }
.how-ending { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:40px; border-top:1px solid var(--how-line); padding-top:50px; margin-top:60px; }
.how-ending h2 { font-size:34px; font-weight:500; letter-spacing:-.04em; margin:0 0 16px; }
.how-ending p { font-size:12px; color:#94adbe; line-height:1.7; }
.how-ending .how-kicker { margin-bottom:16px; }
.how-ending-actions { display:flex; align-items:center; flex-direction:column; flex-shrink:0; }
.how-story-foot { display:flex; justify-content:space-between; padding:25px max(6.3vw,24px); font-size:10px; color:#829eaf; }
.how-story[data-motion="off"] .how-copy,.how-story[data-motion="off"] .how-scene { transform:none!important; opacity:1!important; transition:none!important; }
.how-chapter:focus-within .how-copy,.how-chapter:focus-within .how-scene { opacity:1; }
@media (min-width:1600px) { .how-chapter { padding-top:110px; padding-bottom:110px; } }
@media (max-width:950px) {
 .how-rail { gap:12px; padding:8px 24px; }.how-rail-dots { gap:3px; }.how-rail-dots a { width:24px; }
 .how-chapter { padding:64px 32px; }.how-chapter-inner { gap:5%; }
 .how-copy h2 { font-size:34px; }.how-copy > p { font-size:13px; }
 .how-control { padding:18px; }.how-control strong { font-size:12px; }.how-client-space { padding:18px 10px; }
 .how-team-support { gap:23px 12px; }.how-team-support h3 { font-size:12px; }.how-team-support p { font-size:10px; }
 .how-delivery li { padding:20px 12px; gap:13px; }.how-delivery li b { font-size:7px; }.how-delivery p { font-size:10px; }
 .how-workflow ol { grid-template-columns:repeat(3,1fr); row-gap:30px; }
 .how-service-panel { padding:24px 22px; }.how-builds > span { font-size:10px; }
 .how-handover,.how-calculator { padding:24px; }.how-stat-inline { gap:16px; }.how-stat-inline strong { font-size:46px; }
 .how-fifty { gap:10px; }.how-ending h2 { font-size:30px; }
}
@media (max-width:700px) {
 .how-rail { flex-wrap:wrap; gap:2px 12px; padding:9px 20px; }
 .how-rail-label { flex:1; font-size:10px; }.how-motion { padding:7px 11px; font-size:9px!important; }
 .how-rail-dots { order:3; flex-basis:100%; gap:3px; justify-content:space-between; }
 .how-rail-dots a { height:27px; width:25px; font-size:8px; }.how-rail-dots a::before { width:3px; height:3px; }
 .how-chapter { padding:56px 24px; scroll-margin-top:86px; }
 .how-chapter-inner { min-height:0; display:flex; flex-direction:column; align-items:stretch; gap:34px; }
 .how-copy h1 { font-size:47px; }.how-copy h2 { font-size:37px; margin-bottom:22px; }.how-kicker { font-size:9px; margin-bottom:20px; }
 .how-copy > p { font-size:13px; max-width:none; line-height:1.8; }.how-copy p.how-lead { font-size:18px; }
 .how-copy,.how-scene { transform:translate3d(0,calc(var(--how-shift) * 20px),0); }
 .how-hero-art { width:100%; max-width:420px; margin-top:-18px; }.how-hero-caption { font-size:8px; }
 .how-chapter-1 .how-chapter-inner { gap:12px; }.how-byline { margin-top:22px!important; }
 .how-foundation-row { padding:18px 16px; }.how-foundation-row h3 { font-size:13px; }
 .how-bars { height:180px; gap:12px; }.how-earn-step h3 { font-size:13px; }
 .how-control { padding:20px; }.how-control strong { font-size:14px; }
 .how-client-branches { gap:10px; }.how-client-space strong { font-size:11px; }.how-client-space span { font-size:9px; }
 .how-team { padding:4px 0 15px; }.how-team-support { gap:26px 20px; }.how-team-support h3 { font-size:13px; }
 .how-delivery li { padding:21px 15px; gap:20px; }.how-delivery li b { font-size:8px; }
 .how-workflow { margin-top:0; }.how-workflow summary { font-size:12px; line-height:1.7; }
 .how-view-key { gap:20px; flex-wrap:wrap; }.how-workflow ol { grid-template-columns:1fr; gap:20px; }.how-workflow li { padding-top:17px; }
 .how-workflow h3 { font-size:14px; margin-bottom:8px; }.how-workflow p { font-size:12px; }.how-workflow li > span { margin-bottom:8px; }
 .how-stat-inline strong { font-size:60px; }.how-market-grid { gap:10px; }.how-market-grid > div { padding:18px 15px; }
 .how-service-panel { min-height:315px; }.how-service-panel h3 { font-size:23px; }.how-service-panel li { font-size:10px; }
 .how-calculator { padding:28px 22px; }#how-revenue { font-size:60px; }.how-setup-example strong { font-size:16px; }
 .how-opportunity { width:100%; max-width:none; }.how-fifty { max-width:380px; gap:14px; }
 .how-handover { padding:23px 19px; }.how-builds { gap:8px 18px; }.how-builds > span { font-size:11px; }
 .how-ending { margin-top:20px; padding-top:35px; flex-direction:column; align-items:stretch; gap:20px; }
 .how-ending-actions { align-items:stretch; }.how-ending-actions > .how-text-link { justify-content:center; margin-top:8px; }
 .how-story-foot { font-size:9px; padding:23px 24px; gap:15px; }
}
@media (prefers-reduced-motion:reduce) {
 .how-copy,.how-scene { transform:none!important; opacity:1!important; transition:none!important; }
 .how-story * { scroll-behavior:auto!important; }.how-button:hover { transform:none; }
}
@media print {
 .studio-header,.how-rail,.how-story-foot,.how-ending-actions,.how-workflow,.how-service-tabs { display:none!important; }
 .how-chapter { break-after:page; padding:35px; border:0; }
 .how-chapter-inner { min-height:0; }.how-copy,.how-scene,.how-scene * { transform:none!important; opacity:1!important; }
}



/* Viewport presentation: staged scene entrances and deliberate slide navigation. */
body[data-how-deck="active"] .studio-footer { display:none!important; }
main.ip-paths[data-how-story="ready"] { width:100%; height:auto; overflow:hidden; }
.how-story.how-presentation { height:calc(100dvh - var(--how-header-height,94px)); display:grid; grid-template-rows:52px minmax(0,1fr) 66px; background:rgba(8,12,16,.36); --how-pointer-x:0; --how-pointer-y:0; }
.how-presentation .how-rail { position:relative; top:auto; min-height:0; padding:0 5vw; border-bottom:1px solid #719bb824; z-index:12; background:#0b1117de; }
.how-rail-label { font-size:9px; color:#c2d8e6; letter-spacing:.12em; }
.how-rail-label b { font-size:8px; font-weight:400; color:#5d7b90; margin-left:14px; }
.how-presentation .how-rail-dots { gap:8px; }
.how-rail-dots button { width:30px; height:32px; padding:0; border:0; background:none; color:#586f81; font:inherit; cursor:pointer; position:relative; }
.how-rail-dots button span { font-size:9px; font-variant-numeric:tabular-nums; }
.how-rail-dots button::after { content:''; position:absolute; bottom:0; left:calc(50% - 2px); width:4px; height:4px; border-radius:50%; background:currentColor; transition:box-shadow .3s,color .3s; }
.how-rail-dots button[aria-current] { color:#b8e8ff; }.how-rail-dots button[aria-current]::after { box-shadow:0 0 12px #78ccff; }
.how-presentation .how-motion { padding:7px 12px; font-size:9px!important; }
.how-deck-stage { min-height:0; position:relative; isolation:isolate; overflow:hidden; }
.how-presentation .how-chapter { position:absolute; inset:0; margin:0; padding:28px 6.3vw; border:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#38566d transparent; overscroll-behavior:contain; opacity:0; visibility:hidden; pointer-events:none; }
.how-presentation .how-chapter.is-active { opacity:1; visibility:visible; pointer-events:auto; z-index:2; }
.how-presentation .how-chapter.is-leaving { visibility:visible; z-index:1; animation:howSlideLeave .65s cubic-bezier(.4,0,.8,.4) both; }
.how-presentation .how-chapter-inner { max-width:1500px; min-height:100%; grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr); align-content:center; gap:6%; }
.how-presentation .how-copy,.how-presentation .how-scene { transform:none; opacity:1; }
.how-presentation .how-copy h1 { font-size:clamp(38px,4.2vw,68px); margin-bottom:21px; }
.how-presentation .how-copy h2 { font-size:clamp(31px,3.35vw,54px); margin-bottom:22px; }
.how-presentation .how-kicker { font-size:9px; margin-bottom:20px; }
.how-presentation .how-copy > p { font-size:13px; line-height:1.75; margin-bottom:14px; max-width:460px; }
.how-presentation .how-copy p.how-lead { font-size:19px; }
.how-presentation .how-copy p.how-note,.how-presentation .how-copy p.how-source { font-size:10px; }
.how-presentation .how-scene { position:relative; min-width:0; }
.how-presentation .how-chapter::before { background:radial-gradient(ellipse at 79% 50%,#2b506b2b,transparent 65%); }
.how-presentation .how-chapter:nth-of-type(3n)::before { background:radial-gradient(ellipse at 74% 50%,#4434662b,transparent 65%); }
.how-deck-controls { position:relative; z-index:12; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 5vw; border-top:1px solid #7096ad25; background:#0b1117ee; }
.how-control-context { display:flex; align-items:center; gap:10px; min-width:0; font-size:12px; font-variant-numeric:tabular-nums; }
.how-current { font-size:22px; color:#d1e9f5; letter-spacing:-.04em; }.how-control-total { font-size:10px; color:#557286; }
.how-current-title { font-size:11px; color:#9db9ca; margin-left:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.how-step-controls { display:flex; gap:8px; }.how-step-controls button { height:38px; border:1px solid #6b98b441; color:#b4d9ef; border-radius:5px; background:linear-gradient(145deg,#2035439c,#101b24); cursor:pointer; padding:0 18px; font:inherit; font-size:11px; }
.how-step-controls [data-previous] { width:40px; padding:0; }.how-step-controls [data-next] { min-width:105px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.how-step-controls { flex:none; align-items:center; }.how-step-controls [data-replay-slide] { width:32px; height:32px; padding:0; font-size:18px; background:transparent; border-color:#6b98b429; }
.how-step-controls button:disabled { opacity:.3; cursor:default; }.how-step-controls button:hover:not(:disabled) { border-color:#b6e3ff95; background:#254153; }
.how-deck-progress { position:absolute; top:-1px; left:0; right:0; height:1px; transform:scaleX(var(--how-progress)); transform-origin:0 50%; background:#a0d9f6; box-shadow:0 0 10px #7ab7f070; transition:transform .8s cubic-bezier(.16,1,.3,1); }
.how-fluid { display:inline-block; position:relative; width:58px; height:58px; flex:none; }
.how-fluid > img { display:block; height:100%; width:100%; object-fit:contain; }
.how-fluid-layer { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:8; }
.how-deck-stage[data-fluid="ready"] .how-fluid > img { visibility:hidden; }
.how-presentation .how-hero-art { width:100%; max-width:600px; height:min(58vh,560px); min-height:340px; aspect-ratio:1.1; margin:auto; }
.how-cover-logo { width:40%!important; height:auto!important; transform:translate(calc(var(--how-pointer-x)*16px),calc(var(--how-pointer-y)*12px))!important; filter:drop-shadow(0 0 30px #78afd830)!important; transition:transform .65s ease; }
.how-cover-rings { position:absolute; inset:4% 5% 10%; border:1px solid #6196b526; border-radius:50%; transform:rotateX(22deg) rotateZ(-16deg); box-shadow:inset 0 0 70px #6ba0c307,0 0 70px #6ba0c307; }
.how-cover-rings::after { content:''; position:absolute; inset:9%; border:1px solid #6196b522; border-radius:50%; }
.how-cover-agent { position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); padding:0; border:0; background:none; color:#acc7d8; display:flex; flex-direction:column; align-items:center; cursor:pointer; z-index:3; }
.how-cover-agent .how-fluid { width:clamp(38px,4vw,62px); height:clamp(38px,4vw,62px); transition:filter .4s; }
.how-cover-agent .how-orb-label { font-size:8px; margin-top:4px; white-space:nowrap; }
.how-cover-agent:hover .how-fluid,.how-cover-agent[aria-pressed=true] .how-fluid { filter:drop-shadow(0 0 14px #8ad2f6); }
.how-cover-agent[aria-pressed=true] .how-orb-label { color:#d6f0ff; }
.how-cover-caption { position:absolute; bottom:-6%; left:0; right:0; text-align:center; display:flex; flex-direction:column; gap:7px; }
.how-cover-caption strong { font-size:12px; font-weight:500; color:#b9d9eb; }.how-cover-caption span { font-size:10px; color:#648398; }
.how-presentation .how-foundation { padding:0; transform-style:preserve-3d; }
.how-foundation-row { width:100%; text-align:left; cursor:pointer; color:inherit; border-top:0; border-left:0; border-right:0; padding:12px 18px!important; align-items:center!important; gap:16px!important; font:inherit; transition:background .3s,box-shadow .3s; }
.how-foundation-row .how-fluid { width:34px; height:34px; }
.how-foundation-row[aria-pressed=true] { background:linear-gradient(105deg,#244457a0,#10202a30); box-shadow:inset 2px 0 #a6d8ef; }
.how-presentation .how-foundation-row h3 { font-size:13px; }.how-presentation .how-foundation-row p { font-size:10px; }
.how-live-detail { font-size:10px; line-height:1.6; color:#89acc2; min-height:32px; margin:15px 0 0; text-wrap:balance; }
.how-presentation .how-earn-step { padding-top:15px; }.how-earn-step .how-fluid { width:43px; height:43px; margin-bottom:12px; }
.how-presentation .how-bars { height:165px; margin-top:26px; }.how-bars > div { transition:opacity .4s,filter .4s; }.how-bars > div[data-dim=true] { opacity:.16; filter:saturate(.1); }
.how-presentation .how-bars > div > .how-client-stack { background:none; mask-image:none; }
.how-presentation .how-earn > .how-diagram-caption { margin-top:35px; }
.how-scene-control { grid-column:1/-1; margin-top:17px; }.how-scene-control label { display:flex; gap:15px; justify-content:space-between; font-size:10px; color:#88a8bd; }
.how-scene-control output { color:#d3e9f4; }.how-scene-control input { width:100%; margin:10px 0 0; accent-color:#a7d5eb; height:15px; cursor:pointer; }
.how-presentation .how-structure { padding:0; }.how-presentation .how-control { padding:13px 19px; }
.how-presentation .how-client-branches { padding-top:43px; }.how-client-space { text-align:left; color:inherit; font:inherit; cursor:pointer; padding:13px 12px!important; transition:background .3s,border .3s,box-shadow .3s; }
.how-client-space[aria-pressed=true] { background:#162f40; border-color:#8cc7e58c; box-shadow:0 0 35px #438cb01c; }
.how-client-space .how-fluid { display:block; width:38px; height:38px; margin-bottom:8px; }
.how-client-space strong { margin-bottom:12px; }.how-client-space::before { top:-14px; height:13px; }
.how-client-space span:not(.how-fluid) { margin:5px 0; }.how-presentation .how-client-branches::before { top:29px; }
.how-presentation .how-team-lead { margin:18px 0 22px; }.how-presentation .how-team-lead img { width:82px; height:82px; }
.how-team-support > button { font:inherit; text-align:left; color:inherit; background:transparent; border:1px solid transparent; border-radius:6px; padding:10px; display:grid; grid-template-columns:38px 1fr; column-gap:10px; cursor:pointer; }
.how-team-support > button .how-fluid { width:38px; height:38px; grid-row:1/3; }.how-team-support > button p { grid-column:2; font-size:10px; }.how-team-support > button h3 { font-size:12px; }
.how-team-support > button[aria-pressed=true] { border-color:#90c2db50; background:#1b334466; }.how-team-support { gap:10px 14px; }
.how-presentation .how-plain-list { margin:15px 0; }.how-presentation .how-plain-list li { font-size:11px; padding-top:8px; padding-bottom:8px; }
 .how-presentation .how-delivery li { display:flex; align-items:center; gap:18px; padding:15px 18px; border-radius:5px; margin-bottom:5px; background:#0f1a2290; border:1px solid #799bb52a; }
.how-presentation .how-delivery li > span { display:grid; place-items:center; flex:none; width:32px; height:32px; font-size:12px; color:#b7dbea; border:1px solid #83afc64a; border-radius:8px; background:linear-gradient(135deg,#b3dcf017,#496b8610); }
.how-presentation .how-delivery li b { font-size:8px; font-weight:400; text-transform:uppercase; margin-left:auto; color:#afd7cf; }
.how-presentation .how-delivery h3 { font-size:13px; }.how-presentation .how-delivery p { font-size:10px; }
.how-presentation .how-workflow { margin-top:0; align-self:start; }.how-presentation .how-workflow summary { padding:16px 0; font-size:11px; }
.how-presentation .how-chapter-6 .how-chapter-inner { align-content:start; padding-top:14px; row-gap:24px; }
.how-presentation .how-workflow-body { padding-top:0; }.how-presentation .how-workflow h3 { font-size:12px; }.how-presentation .how-workflow p { font-size:10px; }
.how-market-grid > button { text-align:left; font:inherit; color:inherit; border:1px solid #6e9ab62a; border-radius:6px; padding:12px 15px; background:linear-gradient(130deg,#18303f7a,#0b16217d); cursor:pointer; display:grid; grid-template-columns:35px 1fr; column-gap:11px; }
.how-market-grid > button .how-industry-icon { width:35px; height:39px; grid-row:1/3; display:grid; place-items:center; color:#c4e1ee; background:linear-gradient(145deg,#a7d4ea1e,#344c670f); border:1px solid #91bdd237; border-radius:8px; box-shadow:inset 0 1px #d3efff14; }
.how-industry-icon svg { width:27px; height:27px; filter:drop-shadow(0 0 5px #81c6e63b); }.how-market-grid > button h3 { font-size:11px; margin:3px 0 5px; }.how-market-grid > button p { grid-column:2; font-size:9px; }
.how-market-grid > button[aria-pressed=true] { border-color:#8ac3e17d; box-shadow:inset 0 0 24px #4185b425; }
.how-presentation .how-stat-inline { margin:20px 0; }.how-presentation .how-stat-inline strong { font-size:54px; }.how-presentation .how-stat-inline p { font-size:10px; }
.how-presentation .how-service-panel { min-height:0; padding:24px; position:relative; }.how-service-panel > .how-fluid { width:86px; height:86px; margin-bottom:17px; }
.how-presentation .how-service-panel h3 { font-size:23px; }.how-presentation .how-service-panel p { font-size:11px; }.how-presentation .how-service-tabs button { font-size:9px; }
.how-presentation .how-calculator { padding:24px 28px; background:radial-gradient(ellipse at 80% 20%,#4665852d,transparent 65%),#0d1922; position:relative; isolation:isolate; }
.how-revenue-energy { position:absolute; right:20px; top:24px; z-index:-1; opacity:calc(.25 + var(--revenue-strength,.2)*.75); }.how-revenue-energy .how-fluid { width:110px; height:110px; }
.how-presentation #how-revenue { font-size:60px; margin-bottom:20px; }.how-presentation .how-range { margin-top:19px; }.how-presentation .how-equation { margin:21px 0; }.how-presentation .how-setup-example { padding-top:16px; gap:7px; }
.how-presentation .how-opportunity { width:100%; max-width:480px; }.how-presentation .how-big-number { font-size:74px; }.how-big-number > b { font-weight:400; }
.how-presentation .how-big-number span { margin-top:8px; margin-bottom:24px; }
.how-presentation .how-fifty { padding-bottom:22px; gap:10px; }.how-fifty i { --how-dot-opacity:1; width:14px; height:14px; background:#a7d7ed; box-shadow:0 0 12px #70b5e236; transition:opacity .3s,box-shadow .3s; }.how-fifty i[data-dim=true] { --how-dot-opacity:.1; opacity:.1; box-shadow:none; }
.how-presentation .how-opportunity-total { padding-top:20px; }.how-presentation .how-opportunity-total strong { font-size:38px; }
.how-presentation .how-handover { padding:24px; }.how-builds > button { border:0; border-bottom:1px solid #91b0c22d; text-align:left; color:#b4cbd9; font:inherit; background:transparent; font-size:11px; padding:12px 0; display:flex; gap:10px; cursor:pointer; align-items:center; }
.how-builds > button[aria-pressed=true] { color:#ddf2ff; }.how-builds > button[aria-pressed=true] i { box-shadow:0 0 10px #a5e7ff; }
.how-presentation .how-handover .how-note { font-size:10px; }.how-presentation .how-builds { margin-bottom:16px; }.how-presentation .how-button { padding:12px 16px; font-size:11px; }
.how-handover-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; margin-top:10px; }.how-handover-actions .how-button { margin-top:0; }
.how-presentation .how-copy > .how-text-link { margin-top:10px; border:1px solid #75a3bf49; padding:13px 19px; border-radius:5px; background:linear-gradient(120deg,#28495c75,#111e2b88); box-shadow:inset 0 1px #a3ddff14; }
.how-chapter.is-active .how-kicker { animation:howTextArrival .6s .06s both; }
.how-chapter.is-active .how-copy h1,.how-chapter.is-active .how-copy h2 { animation:howTextArrival .9s .14s cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-copy > p,.how-chapter.is-active .how-copy > ul { animation:howTextArrival .8s .32s cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-copy > a { animation:howTextArrival .8s .56s both; }
.how-chapter.is-active .how-cover-logo { animation:howLogoArrival 1.3s .1s cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-cover-agent { animation:howConstellationArrival 1.25s calc(.2s + var(--order)*.07s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-cover-rings { animation:howRingArrival 1.5s .18s both; }
.how-chapter.is-active .how-cover-caption { animation:howTextArrival .8s .9s both; }
.how-chapter.is-active .how-foundation-row { animation:howStackArrival 1.1s calc(.12s + var(--order)*.11s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-earn-step { animation:howTextArrival .9s calc(.1s + var(--order,1)*.12s) both; }
.how-chapter.is-active .how-client-block { animation:howBlockBuild .55s calc(.22s + var(--block)*.17s + var(--bar)*.06s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-you,.how-chapter.is-active .how-team-owner { animation:howTextArrival .7s .05s both; }
.how-chapter.is-active .how-control,.how-chapter.is-active .how-team-lead { animation:howCoreArrival 1.1s .2s cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-connector { animation:howLineBuild .6s .3s both; transform-origin:50% 0; }
.how-chapter.is-active .how-client-space { animation:howClientArrival 1s calc(.5s + var(--order)*.14s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-team-support > button { animation:howClientArrival 1s calc(.5s + var(--order)*.11s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-delivery li { animation:howSetupFade .6s calc(.2s + var(--order)*.72s) ease-out both; }
.how-chapter.is-active .how-market-grid > button { animation:howCoreArrival 1s calc(.1s + var(--order)*.07s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-service-panel { animation:howCoreArrival 1.1s .18s cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-service-panel ol li { animation:howProcessArrival .9s .65s both; }
.how-chapter.is-active .how-calculator { animation:howCoreArrival 1s .08s both; }
.how-chapter.is-active .how-range { animation:howTextArrival .9s .35s both; }
.how-chapter.is-active .how-fifty i { animation:howDotBuild .7s calc(.1s + var(--order)*.018s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-builds > button { animation:howProcessArrival .9s calc(.1s + var(--order)*.06s) cubic-bezier(.16,1,.3,1) both; }
.how-chapter.is-active .how-live-detail,.how-chapter.is-active .how-scene-control { animation:howTextArrival .7s .8s both; }
.how-triggered { animation:howInteractionPulse .65s ease!important; }
@keyframes howTextArrival { from {opacity:0;transform:translateY(30px);filter:blur(5px)} to {opacity:1;transform:translateY(0);filter:blur(0)} }
@keyframes howSlideLeave { from {opacity:1;transform:translateY(0) scale(1)} to {opacity:0;transform:translateY(calc(var(--how-direction)*-70px)) scale(.97);filter:blur(5px)} }
@keyframes howLogoArrival { from {opacity:0;scale:.55;filter:blur(18px) drop-shadow(0 0 70px #96d8ff)} to {opacity:1;scale:1;filter:blur(0) drop-shadow(0 0 30px #78afd830)} }
@keyframes howConstellationArrival { from {opacity:0;translate:calc((50% - var(--x))*.65) calc((47% - var(--y))*.65);scale:.05} to {opacity:1;translate:0 0;scale:1} }
@keyframes howRingArrival { from {opacity:0;scale:.2;rotate:-50deg} to {opacity:1;scale:1;rotate:0deg} }
@keyframes howStackArrival { from {opacity:0;transform:perspective(900px) translate3d(80px,-95px,-100px) rotateX(32deg) rotateY(-15deg)} to {opacity:1;transform:perspective(900px) translate3d(0,0,0) rotateX(0) rotateY(0)} }
@keyframes howBlockBuild { from {opacity:0;transform:translateY(-12px);filter:brightness(1.7)} to {opacity:1;transform:translateY(0);filter:brightness(1)} }
@keyframes howCoreArrival { from {opacity:0;transform:perspective(1000px) translateY(35px) rotateY(-12deg) scale(.8)} to {opacity:1;transform:perspective(1000px) translateY(0) rotateY(0) scale(1)} }
@keyframes howClientArrival { from {opacity:0;transform:translateY(-55px) scale(.65)} to {opacity:1;transform:translateY(0) scale(1)} }
@keyframes howLineBuild { from {transform:scaleY(0)} to {transform:scaleY(1)} }
@keyframes howSetupFade { from {opacity:0} to {opacity:1} }
@keyframes howProcessArrival { from {opacity:0;transform:translateX(90px);filter:blur(5px)} to {opacity:1;transform:translateX(0);filter:blur(0)} }
@keyframes howDotBuild { from {opacity:0;transform:scale(0) translateY(40px)} to {opacity:var(--how-dot-opacity,1);transform:scale(1) translateY(0)} }
@keyframes howInteractionPulse { 0% {filter:brightness(1)} 40% {filter:brightness(1.5)} 100% {filter:brightness(1)} }
.how-presentation[data-motion=off] *, .how-presentation[data-motion=off] *::before,.how-presentation[data-motion=off] *::after { animation-play-state:paused!important; transition:none!important; }
.how-presentation[data-motion-mode=reduced] *, .how-presentation .how-chapter[data-static=true] * { animation:none!important; transition:none!important; }
.how-presentation[data-motion=off] .how-chapter:not(.is-active) { display:none; }
.how-presentation[data-motion=off] .how-cover-agent { transform:translate(-50%,-50%)!important; }
@media (max-height:760px) and (min-width:951px) {
 .how-presentation .how-chapter { padding-top:20px;padding-bottom:20px; }
 .how-presentation .how-copy h1 { font-size:52px; }.how-presentation .how-copy h2 { font-size:42px; margin-bottom:17px; }
 .how-presentation .how-kicker { margin-bottom:17px; }.how-presentation .how-copy > p { font-size:12px; }
 .how-presentation .how-hero-art { height:390px;min-height:0; }.how-presentation .how-cover-caption { bottom:-6%; }
 .how-presentation .how-foundation-row { padding-top:9px!important;padding-bottom:9px!important; }.how-presentation .how-foundation-row p { font-size:9px; }
 .how-presentation .how-bars { height:130px; margin-top:18px; }.how-presentation .how-earn > .how-diagram-caption { margin-top:29px; font-size:9px; }
 .how-presentation .how-earn .how-scene-control { margin-top:8px; }.how-presentation .how-earn .how-live-detail { min-height:0; margin-top:9px; }
 .how-presentation .how-delivery li { padding:11px 16px; }.how-presentation .how-delivery h3 { font-size:12px; }
 .how-presentation .how-calculator { padding:20px 24px; }.how-presentation #how-revenue { font-size:51px;margin-bottom:12px; }
 .how-presentation .how-range { margin-top:12px; }.how-presentation .how-range input { margin-top:5px; }.how-presentation .how-equation { margin:14px 0; }
 .how-presentation .how-setup-example strong { font-size:14px; }.how-presentation .how-opportunity-total { padding-top:12px; }
 .how-presentation .how-big-number { font-size:62px; }.how-presentation .how-fifty { padding-bottom:17px; }.how-presentation .how-opportunity .how-diagram-caption { margin-top:14px; }
 .how-presentation .how-big-number span { margin-bottom:16px; }.how-presentation .how-opportunity .how-scene-control { margin-top:8px; }
 .how-presentation .how-builds > button { padding:10px 0; }.how-presentation .how-handover { padding:19px; }
}
@media(max-width:1050px) {
 .how-rail-label b { display:none; }.how-presentation .how-chapter { padding:24px 4vw; }.how-presentation .how-chapter-inner { gap:5%; }
 .how-presentation .how-copy h2 { font-size:35px; }.how-presentation .how-team-support { gap:8px; }.how-team-support > button { padding:6px; }
 .how-presentation .how-market-grid > button { padding:12px 9px; column-gap:7px; }.how-presentation .how-market-grid > button h3 { font-size:10px; }
}
@media(max-width:700px) {
 .how-story.how-presentation { grid-template-rows:68px minmax(0,1fr) 64px; }
 .how-presentation .how-rail { padding:8px 18px; flex-wrap:wrap; gap:3px 8px; }.how-presentation .how-rail-label { flex:1; font-size:8px; }.how-presentation .how-rail-dots { order:3;flex-basis:100%;gap:2px;justify-content:space-between; }
 .how-presentation .how-rail-dots button { width:24px;height:24px; }.how-presentation .how-rail-dots button span { font-size:8px; }.how-presentation .how-motion { font-size:8px!important;padding:5px 9px; }
 .how-presentation .how-chapter { padding:28px 24px 35px; }.how-presentation .how-chapter-inner { min-height:100%;display:flex;gap:25px;justify-content:center; }
 .how-presentation .how-copy h1 { font-size:39px; }.how-presentation .how-copy h2 { font-size:33px; }.how-presentation .how-kicker { font-size:8px;margin-bottom:15px; }
 .how-presentation .how-copy > p { font-size:12px;line-height:1.7;margin-bottom:12px; }.how-presentation .how-copy p.how-lead { font-size:16px; }
 .how-presentation .how-copy p.how-note,.how-presentation .how-copy p.how-source { font-size:9px; }
 .how-presentation .how-hero-art { min-height:280px;height:282px;width:100%; }.how-presentation .how-cover-agent .how-fluid { width:35px;height:35px; }.how-cover-agent .how-orb-label { font-size:6px; }.how-presentation .how-cover-caption { bottom:-4%; }
 .how-presentation .how-cover-caption strong { font-size:10px; }.how-presentation .how-cover-caption span { font-size:8px; }
 .how-presentation .how-chapter-1 { padding-top:20px;padding-bottom:25px; }.how-presentation .how-chapter-1 .how-chapter-inner { gap:8px; }.how-presentation .how-copy > .how-text-link { padding:10px 14px; font-size:10px; margin-top:2px; }
 .how-deck-controls { padding:0 18px;gap:10px; }.how-current { font-size:19px; }.how-current-title { font-size:9px;margin-left:3px; }.how-control-context { gap:6px; }
 .how-step-controls button { height:34px;padding:0 13px;font-size:10px; }.how-step-controls [data-previous] { width:33px; }.how-step-controls [data-next] { min-width:78px;gap:12px; }
 .how-presentation .how-foundation-row h3 { font-size:12px; }.how-presentation .how-foundation-row p { font-size:9px; }.how-presentation .how-client-space { padding:13px 9px!important; }
 .how-presentation .how-market-grid > button { padding:12px 10px; grid-template-columns:27px 1fr; }.how-market-grid > button .how-industry-icon { width:27px;height:32px; }.how-industry-icon svg { width:22px;height:22px; }.how-presentation .how-market-grid p { font-size:8px; }
 .how-presentation .how-chapter-6 .how-chapter-inner { padding-top:0; }.how-presentation .how-service-panel { padding:20px; }.how-service-panel > .how-fluid { width:70px;height:70px; }
 .how-presentation .how-handover { padding:21px; }.how-presentation .how-builds > button { font-size:10px; }.how-presentation .how-revenue-energy .how-fluid { width:86px;height:86px; }
 .how-presentation .how-calculator { padding:24px 20px; }.how-presentation #how-revenue { font-size:53px; }.how-presentation .how-scene { flex-shrink:0; }
}
@media(prefers-reduced-motion:reduce) { .how-presentation *,.how-presentation *::before,.how-presentation *::after { animation:none!important;transition:none!important; }.how-presentation .how-chapter:not(.is-active) { display:none; }.how-presentation .how-cover-agent { transform:translate(-50%,-50%)!important; } }


/* Keep the icon on top of the shared fluid canvas, inside the actual orb. */
.how-presentation .how-chapter-1.is-active,.how-presentation .how-chapter-11.is-active { z-index:auto; }
.how-cover-agent { z-index:9; }
.how-cover-agent .how-orb-label { max-width:108px; text-align:center; white-space:normal; line-height:1.4; }
.how-presentation .how-cover-caption { top:calc(100% + 4px); bottom:auto; left:4%; right:4%; }
.how-presentation .how-chapter-1 .how-scene { padding-bottom:40px; }
.how-presentation .how-chapter-1 .how-scene:has(.how-cover-agent[aria-pressed="true"]) { padding-bottom:72px; }
.how-cover-caption strong { line-height:1.45; }
.how-cover-caption > span { line-height:1.5; }
.how-builds > button { position:relative; z-index:9; }
.how-builds .how-build-marker { position:relative; width:28px; height:28px; display:block; flex:none; padding:0; border:0; }
.how-build-marker > .how-fluid { width:100%; height:100%; padding:0; margin:0; border:0; }
.how-presentation .how-builds { column-gap:16px; row-gap:0; }
.how-presentation .how-builds > button { padding:8px 0; gap:8px; }
.how-handover [data-build-detail] { min-height:56px; }
@media(max-width:700px) {
 .how-cover-agent .how-orb-label { font-size:8px; line-height:1.2; max-width:75px; }
 .how-presentation .how-cover-caption { top:calc(100% + 4px); bottom:auto; }
 .how-presentation .how-cover-caption > span { font-size:9px; }
 .how-presentation .how-chapter-1 .how-scene:has(.how-cover-agent[aria-pressed="true"]) { padding-bottom:88px; }
 .how-builds .how-build-marker { width:23px; height:23px; }
 .how-presentation .how-builds { column-gap:10px; }
 .how-handover [data-build-detail] { min-height:72px; }
}
