/* Isolated visual candidate. The approved image bytes and application scripts are unchanged. */
body[data-botai-product="0004"] .intro {
  border-radius: 20px;
  margin: 10px 0 22px;
  padding: 32px;
  color: #fff;
  background-color: #0a223f;
  background-image: linear-gradient(90deg, rgba(5, 24, 44, .9), rgba(5, 24, 44, .68)), url('../../hero-v2.jpg');
  background-size: cover;
  background-position: center 38%;
}
body[data-botai-product="0004"] .intro :is(.eyebrow, .intro-ja, .intro-note, .intro-note span) { color: #f2f8ff; }
body[data-botai-product="0004"] .intro h1 { color: #fff; }
body[data-botai-product="0004"] .intro .eyebrow { font-size: 1rem; letter-spacing: .08em; }
body[data-botai-product="0004"] .intro .intro-note { font-size: 1rem; line-height: 1.65; }
body[data-botai-product="0004"] .intro .intro-note span { font-size: inherit; line-height: inherit; }
body[data-botai-product="0004"] .workspace,
body[data-botai-product="0004"] .data-view { background: #fff; }
body[data-botai-product="0004"] :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #116eaa; outline-offset: 3px; }
@media (max-width: 800px) {
  body[data-botai-product="0004"] .intro { margin: 4px 0 18px; padding: 24px 20px; background-position: 55% 34%; }
}
@media (max-width: 560px) {
  body[data-botai-product="0004"] .intro { padding: 18px; gap: 10px; margin-bottom: 12px; }
  body[data-botai-product="0004"] .intro h1 { margin-bottom: 8px; line-height: 1.25; }
  body[data-botai-product="0004"] .intro .intro-ja { margin-top: 4px; }
  body[data-botai-product="0004"] .intro .intro-note { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-botai-product="0004"] *, body[data-botai-product="0004"] *::before, body[data-botai-product="0004"] *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}