/* bbi-visual 1.4.2 (bbx3-*): day timeline, before/after split, approval flow, connections diagram, use-case cards. Loaded only on AI pages. */
.bbx3-fig{margin:0;display:grid;gap:14px}
[data-k]{transition:opacity .45s,transform .45s,color .45s,background-color .45s,border-color .45s}
.bbx3-pre [data-k]:not(.is-on){opacity:0;transform:translateY(8px)}
.bbx3-replay{justify-self:start;background:none;border:1px solid rgba(255,255,255,.22);color:#dbe7f3;border-radius:999px;padding:6px 14px;font:inherit;font-size:.85rem;cursor:pointer}
.bbx3-replay:focus-visible,.bbx3-uc:focus-visible{outline:2px solid #0bdeb1;outline-offset:2px}
/* day timeline */
.bbx3-bar{display:none}
.bbx3-dayl{list-style:none;margin:0;padding:0 0 0 18px;display:grid;gap:12px;position:relative;border-left:2px solid rgba(34,211,238,.35)}
.bbx3-dayl li{position:relative;display:grid;gap:4px;padding:14px 16px;border-radius:16px;background:linear-gradient(180deg,#0d1424,#0a0d14);border:1px solid rgba(255,255,255,.08);color:#dbe7f3}
.bbx3-dayl li::before{content:"";position:absolute;left:-26px;top:20px;width:12px;height:12px;border-radius:50%;background:#0bdeb1;box-shadow:0 0 10px rgba(11,222,177,.8)}
.bbx3-dayl time{font-weight:800;color:#5ff5d2;font-size:.9rem}
.bbx3-dayl b{display:block;color:#fff}.bbx3-dayl span:not(.bbx2-tag){display:block;font-size:.93rem;color:#cbd5e1}
@media(min-width:1000px){.bbx3-bar{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden}
 .bbx3-bar i{display:block;height:100%;transform-origin:left;background:linear-gradient(90deg,#22d3ee,#0bdeb1);transition:transform .7s}
 .bbx3-dayl{grid-template-columns:repeat(5,1fr);padding:0;border:0}.bbx3-dayl li::before{display:none}}
/* before / after */
.bbx3-cols{display:grid;gap:12px}@media(min-width:560px){.bbx3-cols{grid-template-columns:1fr 1fr}}
.bbx3-col{padding:14px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03)}
.bbx3-col--a{border-color:rgba(34,211,238,.35);background:linear-gradient(180deg,rgba(34,211,238,.08),rgba(255,255,255,.02))}
.bbx3-colh{margin:0 0 10px;font-weight:800;color:#fff}
.bbx3-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bbx3-col li{padding:9px 11px;border-radius:10px;font-size:.92rem;background:rgba(255,255,255,.04);color:#dbe7f3}
.bbx3-col li b{display:block;color:#fff;font-weight:600}
.bbx3-col--b li[data-fx]{text-decoration:line-through;text-decoration-color:rgba(255,255,255,.45);color:#b8c4d2}
.bbx3-pre .bbx3-col--b li[data-fx]:not(.is-on){opacity:1;transform:none;text-decoration:none;color:#dbe7f3}
/* approval flow */
.bbx3-appr{list-style:none;margin:0;padding:0;display:grid;gap:22px;counter-reset:a}
.bbx3-appr li{position:relative;display:grid;gap:4px;padding:16px;border-radius:16px;background:linear-gradient(180deg,#0d1424,#0a0d14);border:1px solid rgba(34,211,238,.3);color:#cbd5e1}
.bbx3-appr li b{color:#fff}.bbx3-appr .bbx-n{margin-bottom:6px}
.bbx3-appr li:not(:last-child)::after{content:"";position:absolute;left:30px;bottom:-22px;width:2px;height:22px;background:linear-gradient(#22d3ee,#0bdeb1)}
.bbx3-btn{justify-self:start;margin-top:8px;padding:6px 14px;border-radius:999px;background:#0bdeb1;color:#04121a;font-weight:800;font-size:.88rem}
.bbx3-appr li.is-on .bbx3-btn{animation:bbx3p 1s ease-out 1}
@keyframes bbx3p{0%{box-shadow:0 0 0 0 rgba(11,222,177,.7)}100%{box-shadow:0 0 0 14px rgba(11,222,177,0)}}
/* connections */
.bbx3-plan{padding:16px;border-radius:20px;border:1px dashed rgba(34,211,238,.45);background:radial-gradient(60% 60% at 50% 50%,rgba(34,211,238,.10),transparent 70%)}
.bbx3-planh{margin:0 0 12px;font-weight:800;color:#5ff5d2;font-size:.9rem;text-align:center}
.bbx3-grid{position:relative}
.bbx3-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:1fr 1fr}
.bbx3-grid li{display:grid;gap:2px;padding:12px;border-radius:14px;background:rgba(11,18,32,.95);border:1px solid rgba(255,255,255,.12);text-align:center;color:#cbd5e1;font-size:.88rem}
.bbx3-grid li b{color:#fff;font-size:.95rem}
.bbx3-grid .bbx3-hub{grid-column:1/-1;background:linear-gradient(135deg,#0796ff,#22d3ee);border:0;color:#04121a}.bbx3-hub b{color:#04121a!important}
.bbx3-lines{display:none}
@media(min-width:620px){.bbx3-grid ul{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,auto);gap:22px 28px;position:relative;z-index:1}
 .bbx3-n1{grid-area:1/1}.bbx3-n2{grid-area:1/3}.bbx3-n3{grid-area:2/1}.bbx3-grid .bbx3-hub{grid-area:2/2}.bbx3-n4{grid-area:2/3}.bbx3-n5{grid-area:3/2}
 .bbx3-grid li{align-self:center}
 .bbx3-lines{display:block;position:absolute;inset:0;width:100%;height:100%}
 .bbx3-lines line{stroke:#22d3ee;stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .6s}
 .bbx3-pre .bbx3-lines line:not(.is-on){opacity:1;transform:none;stroke-dashoffset:1}}
/* checklists and cards */
.bbx3-chk{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px;color:#cbd5e1}
.bbx3-chk li{position:relative;padding-left:26px}.bbx3-chk li::before{content:"✓";position:absolute;left:0;color:#0bdeb1;font-weight:900}
.bbx3-chk b{color:#fff}.bbx3-chk a{color:#5ff5d2}
.bbx3-needh{margin:20px 0 0;font-weight:800;color:#fff}
.bbx3-ucs{list-style:none;margin:0;padding:0;display:grid;gap:16px}
@media(min-width:700px){.bbx3-ucs{grid-template-columns:repeat(2,1fr)}}@media(min-width:1050px){.bbx3-ucs{grid-template-columns:repeat(3,1fr)}}
.bbi .bbi-card.bbx3-uc{display:grid;gap:6px;align-content:start;height:100%;text-decoration:none;color:#cbd5e1}
.bbx3-uc b{color:#fff;font-size:1.08rem}.bbx3-uc em{font-style:normal;font-weight:700;color:#5ff5d2;display:inline-flex;align-items:center;gap:6px}
.bbx3-uc:hover{border-color:rgba(34,211,238,.45)}
.bbx3-relp{color:#cbd5e1;margin:0 0 16px}.bbx3-relp a{color:#5ff5d2}
@media(prefers-reduced-motion:reduce){[data-k],.bbx3-bar i,.bbx3-lines line{transition:none}.bbx3-appr li.is-on .bbx3-btn{animation:none}.bbx3-replay{display:none}}

/* 1.4.4: 6th card, 3 left + 3 right of the hub on desktop */
@media(min-width:620px){.bbx3-n5{grid-area:3/1}.bbx3-n6{grid-area:3/3}}