/* Each business-page surface owns its text color, including nested light panels. */
body.biz-body {
  --biz-surface-text: #16181d;
}

body.biz-body :is(.biz-ai, .biz-usecases, .biz-showcase, .biz-deliverables, .biz-plans, .biz-process, .biz-faq) {
  --biz-surface-text: #16181d;
  background: #fff !important;
  color: var(--biz-surface-text) !important;
}

body.biz-body :is(.biz-hero, .sw-proof, .sw-client-range, .biz-scope, .biz-model-videos, .biz-ai-operations, .sw-contact) {
  --biz-surface-text: #fff;
  color: var(--biz-surface-text) !important;
}

body.biz-body :is(.biz-plan, .biz-model-video-copy, .biz-showcase figcaption, .biz-process-board figcaption, .sw-form) {
  --biz-surface-text: #16181d;
  background: #fff !important;
  color: var(--biz-surface-text) !important;
}

body.biz-body .biz-plan.is-featured {
  --biz-surface-text: #fff;
  background: #7c2441 !important;
  color: var(--biz-surface-text) !important;
}

body.biz-body #main :is(h1, h2, h3, h4, p, li, dt, dd, span, small, strong, em, label, summary, a, button, input, select, textarea, svg) {
  color: var(--biz-surface-text) !important;
}

body.biz-body :is(.biz-hero-status, .biz-usecase-icon) {
  --biz-surface-text: #16181d;
  background: #fff !important;
}

body.biz-body :is(.biz-hero-title-label, .biz-hero-caption, .biz-usecase-media > span, .biz-showcase-tag, .biz-model-video-copy > span) {
  --biz-surface-text: #fff;
  background: #17221e !important;
}

body.biz-body .biz-model-videos {
  background-image: linear-gradient(#07152de6, #07152de6), url("assets/eleworks/live2d/backgrounds/bg-desktop.png") !important;
}

body.biz-body .sw-button {
  --biz-surface-text: #fff;
  background: #7c2441 !important;
  border-color: #7c2441 !important;
}

body.biz-body .sw-button-light {
  --biz-surface-text: #16181d;
  background: #fff !important;
  border-color: #616773 !important;
}

body.biz-body .sw-button:is(:hover, :focus-visible) {
  --biz-surface-text: #fff;
  background: #17221e !important;
  border-color: #fff !important;
}

body.biz-body #main :is(input, select, textarea) {
  --biz-surface-text: #16181d;
  background: #fff !important;
}

body.biz-body #main :is(input, textarea)::placeholder {
  color: #535862 !important;
  opacity: 1;
}

body.biz-body #main :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid #fff !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px #16181d !important;
}

body.biz-body .biz-hero h1 em {
  font-size: 2.5rem !important;
  line-height: 1.45 !important;
}

body.biz-body .biz-hero-lead {
  background: #17221ef2 !important;
}

/* Keep the original media visible; decorative props retain their positioning. */
:is(#main, body.l2d-body main) :is(img, video) {
  object-fit: contain !important;
  object-position: center !important;
}

:is(#main, body.l2d-body main) :is(img:not([alt=""]), video) {
  transform: none !important;
  scale: none !important;
  clip-path: none !important;
}

body.biz-body :is(.biz-usecase, .biz-usecase-media) {
  min-height: 0 !important;
}

body.biz-body .biz-usecase-media {
  display: grid;
  align-content: center;
  background: #f2f4f3 !important;
}

body.biz-body .biz-usecase-media img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
}

body.biz-body .biz-showcase-media {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}

body.biz-body .biz-showcase-media img {
  min-height: 0;
}

body.biz-body :is(.biz-usecase-media > span, .biz-showcase-tag) {
  position: static !important;
  justify-self: start;
  margin: 12px;
}

body.biz-body .biz-process-board img {
  height: auto !important;
  aspect-ratio: auto !important;
  align-self: center;
}

@media (max-width: 640px) {
  body.biz-body .biz-hero h1 em {
    font-size: 1.75rem !important;
  }
}