/* ClaraStream Flow: page-local extension of the approved ClaraStream system. */
.flow-page .flow-hero{padding-block:86px 90px}.flow-page .flow-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.9fr);gap:clamp(54px,7vw,110px);align-items:center}.flow-page .flow-hero-body{margin-top:27px;max-width:690px}.flow-page .flow-buy-button{padding-inline:24px;background:#7a5a3a!important;border-color:#7a5a3a!important;font-weight:600}
.flow-page .flow-hero-relation{display:grid;grid-template-columns:1fr 30px 1fr 30px 1fr;align-items:stretch;gap:11px;margin:0;padding:48px 0;border-top:1px solid rgba(244,247,248,.2);border-bottom:1px solid rgba(244,247,248,.2)}.flow-page .flow-hero-relation>div{padding:27px 14px;border-top:1px solid rgba(244,247,248,.28);border-bottom:1px solid rgba(244,247,248,.28)}.flow-page .flow-hero-relation strong,.flow-page .flow-hero-relation small{display:block;text-align:center}.flow-page .flow-hero-relation strong{font:500 .78rem/1.5 "IBM Plex Mono",monospace;letter-spacing:.05em}.flow-page .flow-hero-relation small{margin-top:10px;color:#b6aea1;font-size:.82rem;line-height:1.45}.flow-page .flow-hero-relation>span{align-self:center;text-align:center;color:#9fb8d8;font-size:1.5rem}.flow-page .flow-hero-relation>span:nth-of-type(2){color:#7a5a3a}.flow-page .flow-hero-relation .flow-hero-result{border-color:#7a5a3a}
.flow-page .flow-function-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:46px;border-top:1px solid rgba(21,26,31,.22);border-bottom:1px solid rgba(21,26,31,.22)}.flow-page .flow-function-grid article{padding:28px 30px}.flow-page .flow-function-grid article+article{border-left:1px solid rgba(21,26,31,.18)}.flow-page .flow-step{margin:0;font:500 .72rem/1.45 "IBM Plex Mono",monospace;letter-spacing:.08em;color:#7a5a3a}.flow-page .flow-function-grid h3,.flow-page .flow-stage-grid h3{margin:14px 0 13px;font-size:1.22rem;font-weight:400;line-height:1.42}.flow-page .flow-function-grid article>p:last-child{margin:0;color:#50585e;line-height:1.65}
.flow-page .flow-bundle{display:grid;grid-template-columns:1fr 32px 1fr 32px 1fr;align-items:stretch;gap:16px;margin-top:36px}.flow-page .flow-bundle>div{padding:24px;border-top:1px solid rgba(21,26,31,.24);border-bottom:1px solid rgba(21,26,31,.24)}.flow-page .flow-bundle strong,.flow-page .flow-bundle small{display:block}.flow-page .flow-bundle strong{font:500 .74rem/1.5 "IBM Plex Mono",monospace;letter-spacing:.04em}.flow-page .flow-bundle small{margin-top:10px;color:#50585e;font-size:.88rem;line-height:1.5}.flow-page .flow-bundle>span{align-self:center;text-align:center;font-size:1.5rem;color:#7a5a3a}
.flow-page .flow-why{background:#f4f7f8}.flow-page .flow-architecture-rule{display:grid;grid-template-columns:1fr 36px 1fr;align-items:center;margin-top:46px}.flow-page .flow-architecture-rule i{border-top:1px solid #9fb8d8}.flow-page .flow-architecture-rule i:last-child{border-color:#7a5a3a}.flow-page .flow-architecture-rule span{height:36px;border-left:2px solid #9fb8d8;border-right:2px solid #7a5a3a}
.flow-page .flow-stage-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:45px;border-top:1px solid rgba(244,247,248,.22);border-bottom:1px solid rgba(244,247,248,.22)}.flow-page .flow-stage-grid article{padding:27px 29px}.flow-page .flow-stage-grid article+article{border-left:1px solid rgba(244,247,248,.18)}.flow-page .flow-stage-grid .flow-step{color:#9fb8d8}.flow-page .flow-stage-grid article>p:last-child{margin:0;color:rgba(244,247,248,.74);line-height:1.65}
.flow-page .flow-data-path{display:grid;align-items:center;gap:8px;margin-top:36px;padding:30px 0;border-top:1px solid rgba(244,247,248,.2);border-bottom:1px solid rgba(244,247,248,.2)}.flow-page .flow-data-path-long{grid-template-columns:1fr 18px 1fr 18px .8fr 18px 1fr 18px 1.15fr 18px 1fr}.flow-page .flow-data-path>div{padding:19px 8px;text-align:center}.flow-page .flow-data-path strong,.flow-page .flow-data-path small{display:block}.flow-page .flow-data-path strong{font:500 .64rem/1.5 "IBM Plex Mono",monospace;letter-spacing:.025em}.flow-page .flow-data-path small{margin-top:8px;color:#b6aea1;font-size:.78rem}.flow-page .flow-data-path>span{text-align:center;color:#9fb8d8}.flow-page .flow-data-path>span:nth-of-type(n+2){color:#7a5a3a}.flow-page .flow-path-center{border-left:1px solid #9fb8d8;border-right:1px solid #7a5a3a}
.flow-page .flow-current{background:#edf1f3}.flow-page .flow-current-path{grid-template-columns:.65fr 22px 1fr 22px .8fr 22px 1fr 22px 1.25fr;border-color:rgba(21,26,31,.22)}.flow-page .flow-current-path>span{color:#7a5a3a}.flow-page .flow-closing{max-width:900px;margin:30px 0 0;color:#50585e;font-size:1.02rem;line-height:1.7}
.flow-page .flow-standard-relation{display:grid;grid-template-columns:1fr 42px 1fr;align-items:stretch;margin-top:44px}.flow-page .flow-standard-relation>div{padding:27px 28px;border-top:1px solid rgba(21,26,31,.23);border-bottom:1px solid rgba(21,26,31,.23)}.flow-page .flow-standard-relation strong{font:500 .76rem/1.5 "IBM Plex Mono",monospace;color:#7a5a3a;letter-spacing:.04em}.flow-page .flow-standard-relation p{margin:11px 0 0;line-height:1.6}.flow-page .flow-standard-relation>span{align-self:center;text-align:center;color:#7a5a3a;font-size:1.5rem}.flow-page .flow-short-name{display:inline-block;margin:25px 0 0;padding:10px 15px;border-left:2px solid #7a5a3a;font-size:1rem}.flow-page .flow-short-name span{font:500 .72rem "IBM Plex Mono",monospace;color:#7a5a3a;letter-spacing:.04em;margin-right:10px}
.flow-page .flow-editions{background:#edf1f3}.flow-page .flow-edition-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:46px;border-top:1px solid rgba(21,26,31,.22);border-bottom:1px solid rgba(21,26,31,.22)}.flow-page .flow-edition-grid article{padding:30px}.flow-page .flow-edition-grid article+article{border-left:1px solid rgba(21,26,31,.18)}.flow-page .flow-edition-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.flow-page .flow-edition-head span{padding:7px 9px;border:1px solid #7a5a3a;font:500 .66rem/1.3 "IBM Plex Mono",monospace;letter-spacing:.1em;color:#7a5a3a}.flow-page .flow-edition-grid h3{margin:20px 0 0;font-size:1.3rem;font-weight:400;line-height:1.45}.flow-page .flow-edition-grid article>p:last-child{margin:16px 0 0;color:#50585e;line-height:1.65}
.flow-page .flow-use-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:44px;border-top:1px solid rgba(21,26,31,.22)}.flow-page .flow-use-grid article{display:grid;grid-template-columns:.72fr 1.28fr;gap:24px;padding:24px 0;border-bottom:1px solid rgba(21,26,31,.18)}.flow-page .flow-use-grid article:nth-child(odd){padding-right:28px}.flow-page .flow-use-grid article:nth-child(even){padding-left:28px;border-left:1px solid rgba(21,26,31,.18)}.flow-page .flow-use-grid h3{margin:0;font:500 .75rem/1.5 "IBM Plex Mono",monospace;color:#7a5a3a;letter-spacing:.04em}.flow-page .flow-use-grid p{margin:0;color:#50585e;line-height:1.62}
.flow-page .flow-json{background:#f4f7f8}.flow-page .flow-json-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);gap:clamp(50px,7vw,100px);align-items:center}.flow-page .flow-json .hw-body{margin-top:26px}.flow-page .flow-json-cta{display:inline-flex;gap:28px;align-items:center;margin-top:28px;padding:12px 0;border-bottom:1px solid #7a5a3a;font-weight:500;line-height:1.5}.flow-page .flow-json-cta span{color:#7a5a3a}.flow-page .flow-json-cta[hidden]{display:none}.flow-page .flow-json-path{display:grid;grid-template-columns:1fr 25px 1.25fr 25px .55fr;align-items:center;gap:10px;margin:0;padding:32px 0;border-top:1px solid rgba(21,26,31,.22);border-bottom:1px solid rgba(21,26,31,.22)}.flow-page .flow-json-path>div{text-align:center;padding:17px 8px}.flow-page .flow-json-path strong,.flow-page .flow-json-path small{display:block}.flow-page .flow-json-path strong{font:500 .68rem/1.5 "IBM Plex Mono",monospace;letter-spacing:.03em}.flow-page .flow-json-path small{margin-top:8px;color:#50585e;font-size:.8rem}.flow-page .flow-json-path>span{text-align:center;color:#7a5a3a;font-size:1.25rem}
.flow-page .flow-deployment{background:#e6e7e6}.flow-page .flow-deployment-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);gap:clamp(48px,7vw,100px);align-items:center}.flow-page .flow-deployment .hw-body{margin-top:29px}.flow-page .flow-environment{height:520px;margin:0;background:#151a1f;overflow:hidden}.flow-page .flow-environment img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.72)}.flow-page .flow-flexibility{padding-block:92px}
@media(max-width:1100px){.flow-page .flow-hero-grid,.flow-page .flow-json-grid,.flow-page .flow-deployment-grid{grid-template-columns:1fr}.flow-page .flow-hero-relation{max-width:820px}.flow-page .flow-data-path{overflow-x:auto}.flow-page .flow-data-path-long{min-width:980px}.flow-page .flow-current-path{min-width:820px}.flow-page .flow-use-grid article{grid-template-columns:1fr;gap:10px}.flow-page .flow-environment{height:360px}}
@media(max-width:760px){.flow-page .flow-hero-relation,.flow-page .flow-function-grid,.flow-page .flow-bundle,.flow-page .flow-stage-grid,.flow-page .flow-data-path-long,.flow-page .flow-current-path,.flow-page .flow-standard-relation,.flow-page .flow-edition-grid,.flow-page .flow-use-grid,.flow-page .flow-json-path{grid-template-columns:1fr;min-width:0}.flow-page .flow-hero-relation>span,.flow-page .flow-bundle>span,.flow-page .flow-data-path>span,.flow-page .flow-standard-relation>span,.flow-page .flow-json-path>span{transform:rotate(90deg);padding:0}.flow-page .flow-function-grid article,.flow-page .flow-stage-grid article,.flow-page .flow-edition-grid article{padding:24px 0}.flow-page .flow-function-grid article+article,.flow-page .flow-stage-grid article+article,.flow-page .flow-edition-grid article+article{border-left:0;border-top:1px solid rgba(21,26,31,.18)}.flow-page .flow-stage-grid article+article{border-color:rgba(244,247,248,.18)}.flow-page .flow-path-center{border-left:0;border-right:0;border-top:1px solid #9fb8d8;border-bottom:1px solid #7a5a3a}.flow-page .flow-use-grid article,.flow-page .flow-use-grid article:nth-child(odd),.flow-page .flow-use-grid article:nth-child(even){padding:22px 0;border-left:0}.flow-page .flow-environment{height:280px}}
.flow-page .flow-json-path{grid-template-columns:minmax(0,1.4fr) 18px minmax(0,.85fr) 18px minmax(0,.55fr) 18px minmax(0,1.05fr);gap:5px}
@media(max-width:760px){.flow-page .flow-json-path{grid-template-columns:1fr;gap:10px}}

/* One prepared stream, three equal and independent capabilities. */
.flow-page .flow-json-path{grid-template-columns:minmax(0,1fr);grid-template-rows:80px auto;align-items:stretch;gap:0;min-height:310px}
.flow-page .flow-json-path>.flow-json-source{position:relative;display:flex;align-items:center;justify-content:center;min-height:80px;padding:14px 8px}
.flow-page .flow-json-path>.flow-json-source strong{font-size:.9rem;line-height:1.45;letter-spacing:.05em}
.flow-page .flow-json-source::after{content:"";position:absolute;left:50%;top:100%;height:48px;border-left:1px solid #7a5a3a}
.flow-page .flow-json-path>.flow-json-options{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:82px 0 0}
.flow-page .flow-json-options::before{content:"";position:absolute;left:16.666%;right:16.666%;top:48px;border-top:1px solid #7a5a3a}
.flow-page .flow-json-options>div{position:relative;display:flex;align-items:flex-start;justify-content:center;min-height:100px;padding:18px 5px;text-align:center}
.flow-page .flow-json-options>div strong{font-size:.78rem;line-height:1.55;letter-spacing:.025em}
.flow-page .flow-json-options>div::before{content:"";position:absolute;left:50%;top:-34px;height:34px;border-left:1px solid #7a5a3a}
@media(max-width:760px){
  .flow-page .flow-json-path{grid-template-columns:minmax(0,1fr);grid-template-rows:68px auto;min-height:0}
  .flow-page .flow-json-path>.flow-json-source{min-height:68px;justify-content:flex-start;padding:8px 8px 8px 46px;text-align:left}
  .flow-page .flow-json-source::after{left:22px;top:50%;height:50%}
  .flow-page .flow-json-path>.flow-json-options{grid-template-columns:minmax(0,1fr);gap:0;padding:0 0 0 46px}
  .flow-page .flow-json-options::before{left:22px;right:auto;top:0;bottom:35px;border-top:0;border-left:1px solid #7a5a3a}
  .flow-page .flow-json-options>div{min-height:70px;align-items:center;justify-content:flex-start;padding:12px 8px;text-align:left}
  .flow-page .flow-json-options>div::before{left:-24px;top:50%;width:24px;height:0;border-left:0;border-top:1px solid #7a5a3a}
}