/* Local preview only: horizontal learning flow. */
.insight-flow{padding:32px}
.flow-network{display:grid;grid-template-columns:1.05fr .85fr 1fr 1.25fr;align-items:center;gap:64px;max-width:none;margin:40px 0 24px;isolation:isolate}
.continuation-routes{z-index:-1}
.flow-inputs{display:grid;gap:24px}
.flow-input{position:relative;border:1px solid #bdcebc;border-radius:12px;background:#f6f8f2;padding:24px 16px;text-align:center;color:#284b36}
.flow-input h3{font-size:23px;font-weight:500;line-height:1.2}
.flow-input p{font-size:12px;line-height:1.5;margin:8px 0 16px;color:#4b6352}
.lab-icons{display:flex;justify-content:center;gap:12px}
.source-community>.source-icon{margin:0 auto 12px}
.flow-bank{position:relative;inset:auto;width:auto;transform:none;padding:16px 0}
.flow-logs{display:grid;grid-template-columns:1fr;gap:40px;margin:0;max-width:none}
.flow-log{padding:16px 4px;background:#edf1e9}
.flow-log h3{font-size:23px;line-height:1.2}
.flow-vision{margin:0;padding:16px 0;background:#edf1e9}
.flow-vision h3{font-size:30px;line-height:1.12}
.flow-vision p{font-size:12px;line-height:1.7}
.flow-vision p br{display:none}
.flow-caption{margin-top:24px}
@media(max-width:1100px) and (min-width:761px){.flow-network{gap:30px}.insight-flow{padding:24px}.flow-input{padding:20px 12px}.flow-input h3,.flow-log h3{font-size:20px}.flow-vision h3{font-size:26px}.bank-stack{width:76px;height:76px}}
@media(max-width:760px){.insight-flow{padding:24px 16px}.flow-network{grid-template-columns:1fr;gap:48px;margin-top:24px}.flow-inputs{grid-template-columns:1fr 1fr;gap:16px}.flow-input{padding:20px 8px}.flow-input h3{font-size:20px}.flow-input p{font-size:11px}.lab-icons{gap:8px}.flow-bank{width:160px;justify-self:center;left:auto;top:auto;transform:none}.flow-logs{grid-template-columns:1fr 1fr;gap:24px;width:100%}.flow-log h3{font-size:20px}.flow-vision{margin:0 auto;max-width:340px}.flow-vision h3{font-size:29px}.flow-vision p{font-size:12px}.flow-caption{font-size:9px}}
/* Community invitation: the whole box and its plus share one accessible link. */
:is(a.source-community,a.source-community-link){display:block;text-decoration:none;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
.community-plus{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--blue);transition:background-color .2s ease,color .2s ease}
.community-plus svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
:is(a.source-community,a.source-community-link):focus-visible{outline:2px solid var(--blue);outline-offset:4px;box-shadow:0 6px 28px #0b56f740}
:is(a.source-community,a.source-community-link):focus-visible .community-plus{background:var(--blue);color:white}
@media(hover:hover) and (pointer:fine){:is(a.source-community,a.source-community-link):hover{border-color:var(--blue);background:#f3f6ff;box-shadow:0 6px 28px #0b56f740}:is(a.source-community,a.source-community-link):hover .community-plus{background:var(--blue);color:white}}
@media(prefers-reduced-motion:reduce){:is(a.source-community,a.source-community-link),.community-plus{transition:none}}
/* Sources lead the visual hierarchy; the insight bank supports the flow. */
.flow-network{grid-template-columns:1.25fr .65fr 1fr 1.25fr}
.flow-input{padding:28px 20px;background:#f9fbf6;border-color:#a7bea9}
.flow-input h3{font-size:30px;font-weight:600;color:#173d2b}
.flow-input p{font-size:14px}
.flow-bank .bank-stack{width:64px;height:64px;margin-bottom:20px}
.flow-bank .bank-face{background:#e1e9dc;box-shadow:none;border:1px solid #b6c9b7;border-radius:10px}
.flow-bank .bank-face img{width:34px;height:34px;filter:none}
.flow-bank .bank-stack i{background:#d4dfd0;border-radius:10px}
.flow-bank .bank-stack i:nth-child(2){background:#c9d8c5}
.flow-bank .bank-stack i:nth-child(3){background:#bdd0b9}
.flow-bank strong{font-size:19px;font-weight:500;color:#52605b}
.flow-bank>span{font-size:11px;color:#52605b}
@media(max-width:1100px) and (min-width:761px){.flow-input{padding:24px 12px}.flow-input h3{font-size:26px}.flow-input p{font-size:12px}.flow-bank strong{font-size:18px}}
@media(max-width:760px){.flow-network{grid-template-columns:1fr}.flow-input{padding:24px 8px}.flow-input h3{font-size:23px}.flow-input p{font-size:12px}.flow-bank .bank-stack{width:56px;height:56px}.flow-bank .bank-face img{width:30px;height:30px}.flow-bank strong{font-size:18px}}
.flow-bank .bank-face img{filter:brightness(0) saturate(100%) invert(35%) sepia(12%) saturate(589%) hue-rotate(92deg) brightness(94%) contrast(87%)}
/* Blue insight icon, retaining the bank's secondary visual weight. */
.flow-bank .bank-face img{filter:brightness(0) saturate(100%) invert(25%) sepia(100%) saturate(4738%) hue-rotate(220deg) brightness(98%) contrast(101%)}
/* Separate the white icon discs from both source boxes. */
.flow-input.source-lab,.flow-input.source-community{background:#e4edff;border-color:#b5caf3}
@media(hover:hover) and (pointer:fine){.flow-input.source-lab:hover,.flow-input.source-community:hover{background:#d8e6ff;border-color:var(--blue)}}
