/* Editorial BSD sequence: illustration, not a live detection result. */
.bsd-demo{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center;margin:40px 0;padding:36px;border:1px solid #dce2d3;border-radius:24px;background:#f8faf3;color:#1d241b;overflow:hidden}
.bsd-copy h3{font-size:clamp(27px,3.2vw,44px);line-height:1.08;letter-spacing:-.04em;margin:16px 0 20px}
.bsd-copy>p:not(.eyebrow){font-size:16px;line-height:1.7;max-width:460px;color:#586151}
.bsd-copy>small{display:block;font-size:12px;line-height:1.5;color:#68735e;margin-top:16px;max-width:350px}
.bsd-status{display:inline-flex;gap:9px;align-items:center;margin-top:16px;padding:10px 14px;border:1px solid #dbc76c;border-radius:8px;background:#fff8d9;font-size:14px;font-weight:600}
.bsd-status i{width:8px;height:8px;border-radius:50%;background:#b88e16;flex:none;animation:bsd-warning 7s infinite}
.bsd-scene{position:relative;isolation:isolate;min-width:0}.bsd-scene svg{width:100%;height:auto;display:block}.bsd-scene-label{position:absolute;top:16px;left:14%;font:10px monospace;letter-spacing:.08em;color:#5b6851}
.bsd-zone{fill:#d8e8a6;fill-opacity:.4;stroke:#91a15c;stroke-width:1.3;stroke-dasharray:5 4}
.bsd-zone-detected{animation:bsd-zone 7s infinite}
.bsd-vehicle{animation:bsd-pass 7s ease-in-out infinite}.bsd-target,.bsd-alert{animation:bsd-warning 7s infinite}.bsd-radar{animation:bsd-radar 3.5s ease-in-out infinite}
@keyframes bsd-pass{0%,10%{transform:translateY(120px)}40%,65%{transform:translateY(-30px)}90%,100%{transform:translateY(-320px)}}
@keyframes bsd-warning{0%,16%,82%,100%{opacity:.12}28%,70%{opacity:1}}
@keyframes bsd-zone{0%,16%,82%,100%{fill-opacity:.2;stroke:#91a15c}28%,70%{fill:#f3d570;fill-opacity:.35;stroke:#b58b16}}
@keyframes bsd-radar{0%,100%{opacity:.25}50%{opacity:.8}}
.ml-explore-paused .bsd-demo *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.bsd-demo *{animation:none!important}.bsd-vehicle{transform:translateY(-30px)}}
@media(max-width:700px){.bsd-demo{grid-template-columns:1fr;gap:24px;padding:24px;margin:28px 0}.bsd-copy h3{font-size:32px}.bsd-scene-label{top:10px;font-size:9px}.bsd-copy>p:not(.eyebrow){font-size:15px}}

.bsd-copy .eyebrow{color:#626e54}

/* Hero preview replaces the redundant feature banner; no extra visual layer. */
.bsd-peek{position:absolute;top:28px;left:8%;z-index:3;width:238px;height:104px;display:flex;align-items:center;justify-content:space-between;gap:4px;padding:8px 9px 8px 15px;box-sizing:border-box;border:1px solid #cbd4b9;border-radius:10px;background:#f8faf3;box-shadow:0 8px 24px #25321f18;transform:rotate(-4deg) translateZ(0);color:#263523;text-decoration:none;isolation:isolate}
.bsd-peek-copy{flex:none;display:block}.bsd-peek-copy b{display:flex;align-items:center;gap:9px;font-size:14px;letter-spacing:.08em}.bsd-peek-copy i{display:block;width:6px;height:6px;border-radius:50%;background:#bb9219;animation:bsd-warning 7s infinite}.bsd-peek-copy strong{display:block;font-size:12px;font-weight:500;margin-top:5px}.bsd-peek-copy small{display:block;font-size:9px;color:#65725b;margin-top:9px}.bsd-peek-copy small span{margin-left:9px}.bsd-peek svg{display:block;width:115px;height:86px;overflow:hidden;border-radius:5px}.bsd-peek:focus-visible{outline:3px solid #7d943f;outline-offset:4px}
.hero-motion-paused .bsd-peek *,.ml-explore-paused .bsd-peek *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.bsd-peek *{animation:none!important}}
@media(max-width:750px){.bsd-peek{top:0;left:9%;width:205px;height:88px;padding:7px 8px 7px 12px}.bsd-peek svg{width:98px;height:72px}.bsd-peek-copy b{font-size:12px}.bsd-peek-copy strong{font-size:11px}.bsd-peek-copy small{font-size:8px;margin-top:6px}}
