/* ==========================================================================
 * 主页视觉层：深色弧线背景 + 「视听有道」LOGO
 *   - 只新增本文件，不修改任何既有样式表，删除本文件即可完整回退
 *   - 必须在 theme-minimal.css 之后加载（要覆盖极简主题的纯黑底）
 *   - 左上角「象限智能」侧栏标识不在本文件作用域内，保持原样不动
 * ========================================================================== */

/* 主页右侧内容区铺背景图；左侧导航仍是原来的纯色 */
body .home-shell .home-main {
  background-color: #000c0e !important;
  background-image: url("assets/brand/home-background-quadrant.webp") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}

/* 极简主题把 #homeStart 刷成纯黑，这里改回透明，让背景透出来 */
body .home-shell .home-content#homeStart {
  background-color: transparent !important;
  background-image: none !important;
}

/* 视频背景层已被极简主题隐藏；万一主题回退，也不许它盖住新背景 */
body .home-shell .home-video-background {
  background-color: transparent !important;
  background-image: none !important;
}
body .home-shell .home-video-background__media {
  opacity: 0 !important;
}

/* 「视听有道」LOGO：主页内容区顶部居中 */
body .home-shell .home-brand-banner {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0 auto clamp(24px, 4.5vh, 52px);
  padding: 0;
  pointer-events: none;
}
body .home-shell .home-brand-banner img {
  display: block;
  width: min(680px, 72%);
  height: auto;
  max-width: 100%;
  border: 0;
  box-shadow: none;
  filter: none;
}

@media (max-width: 900px) {
  body .home-shell .home-brand-banner img {
    width: min(520px, 88%);
  }
}

@media (max-width: 560px) {
  body .home-shell .home-main {
    background-position: 62% center !important;
  }
}

/* --------------------------------------------------------------------------
 * 登录页：同一套「深色弧线 + 视听有道」视觉
 *   - 左上角 .login-brand（象限智能）DOM 与样式一律不动
 *   - 表单卡 .login-form-wrap 保留极简主题的不透明纯色底，保证输入框可读
 *   - 本段必须排在 theme-minimal.css 之后（靠更高特指度压过它的 !important）
 * -------------------------------------------------------------------------- */
html body .login-shell {
  background-color: #000c0e !important;
  background-image: url("assets/brand/home-background-quadrant.webp") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}
body .login-shell .login-intro {
  background: transparent !important;
  background-image: none !important;
}
/* 左上角品牌标识/左下角落款现在浮在整页之上，只给左缘一点点暗晕保证对比度 */
body .login-shell .login-intro::after {
  background: linear-gradient(90deg, rgba(2, 9, 14, .5) 0%, rgba(2, 9, 14, .18) 22%, rgba(2, 9, 14, 0) 46%) !important;
}
/* 右栏透明让弧线透出，表单卡本身仍是纯色 */
body .login-shell .login-panel {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(24px, 4vh, 44px);
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* 矮屏时禁止 flex 压缩，否则 LOGO 会被压扁并与表单卡叠在一起 */
body .login-shell .login-panel > * {
  flex-shrink: 0;
}
body .login-shell .login-brand-banner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(12px, 2vh, 20px);
  justify-content: center;
  width: 100%;
  pointer-events: none;
}
/* 「视听有道」下方标语：视听有道构架AI剧商全链路产业生态服务平台 */
body .login-shell .login-brand-tagline {
  margin: 0;
  text-align: center;
  color: rgba(244, 249, 253, .97);
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 650;
  letter-spacing: .14em;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .65), 0 0 32px rgba(123, 108, 246, .28);
}
body .login-shell .login-brand-banner img {
  display: block;
  width: min(420px, 70%);
  height: auto;
  max-width: 100%;
  border: 0;
  box-shadow: none;
  filter: none;
}
/* 表单卡加宽 + 四角圆一点（压过 theme-minimal 的 --radius-lg） */
body .login-shell .login-form-wrap {
  width: min(100%, 540px);
  border-radius: 22px;
}

@media (max-width: 820px) {
  body .login-shell .login-panel { gap: 28px; }
  body .login-shell .login-brand-banner img { width: min(300px, 72%); }
  body .login-shell .login-intro::after {
    background: linear-gradient(180deg, rgba(2, 9, 14, .42), rgba(2, 9, 14, 0) 32%) !important;
  }
  body .login-shell .login-brand-tagline { letter-spacing: .06em; }
}
@media (max-width: 560px) {
  html body .login-shell { background-position: 62% center !important; }
  body .login-shell .login-brand-banner img { width: min(260px, 78%); }
}
