/* ================================================
   company.css — 公司介绍
   景合画星 官网 v2
   ================================================ */
.about-grid {
  display: grid;
  grid-template-columns: 260px 1fr 1fr;
  gap: 36px;
  max-width: 980px;
  margin: 0 auto;
  align-items: center;
}

/* ---------- 狮子头徽章 ---------- */
.about-emblem {
  display: flex;
  transform: translateX(3.8px);
  align-items: center;
  justify-content: center;
}
.about-emblem .emblem-frame {
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro-lion-logo {
  width: 160px;
  height: auto;
  display: block;
  background: none !important;
  border: none !important;
  filter: drop-shadow(0 0 6px rgba(180, 145, 100, 0.4));
  animation: emblemBreathe 6s ease-in-out infinite;
}
@keyframes emblemBreathe {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.5); }
}
.about-text {
  padding-left: 16px;
}
.about-text p {
  font-size: 0.88rem;
  color: var(--color-text-light);
  line-height: 1.9;
  margin-bottom: 16px;
}

/* ---------- AI 特色块 ---------- */
.ai-feature {
  background: rgba(201,169,110,0.06);
  border-left: 3px solid var(--color-accent);
  padding: 16px 20px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-bottom: 16px;
}
.ai-feature h4 {
  font-family: var(--font-heading);
  font-size: 0.85rem;
  color: var(--color-primary);
  margin-bottom: 6px;
}
.ai-feature p {
  font-size: 0.82rem;
  color: var(--color-text-light);
  line-height: 1.7;
}

/* ---------- 统计卡片 ---------- */
.about-stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  text-align: center;
}
.about-stats .stat-card {
  flex: 0 1 150px;
}
.stat-card {
  background: var(--color-bg-card);
  border: 1px solid rgba(240,214,160,0.92);
  box-shadow: 0 0 8px rgba(235,205,155,0.35), 0 0 20px rgba(235,205,155,0.18), inset 0 0 6px rgba(235,205,155,0.12);
  border-radius: var(--radius-sm);
  padding: 20px 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  transition: var(--transition);
  animation: statCardBreathe 5s ease-in-out infinite;
}
@keyframes statCardBreathe {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.4); }
}
.stat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.stat-number {
  font-family: var(--font-heading);
  font-size: 2rem;
  color: var(--color-accent);
  margin-bottom: 2px;
}
.stat-label {
  font-size: 0.72rem;
  color: var(--color-text-light);
  letter-spacing: 1px;
}

@media (max-width: 768px) {
  .about-grid { grid-template-columns: 1fr; gap: 24px; }
  .intro-lion-logo { width: 130px; }
  .about-stats { gap: 12px; }
  .about-stats .stat-card { flex: 0 1 45%; }
}
/* ================================================
   公司介绍 — 内容层样式（2026-08-08 第三轮）
   背景光影已抽离至 modules/flow-bg 公共组件
   ================================================ */
#about {
  min-height: 88vh;
  display: flex;
  align-items: flex-start;
  padding: 96px 0 150px;
}

/* ---------- 布局：文字居中（左列留白给光带起点），卡片右上角紧凑 ---------- */
#about .about-grid {
  max-width: 1140px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 40px;
  align-items: flex-start;
}
#about .about-text { grid-column: 2; padding-top: 4px; }
#about .about-emblem { align-self: center; padding-top: 4px; }
#about .about-stats { grid-column: 3; }

/* ---------- 卡片：缩小尺寸 + 右上角纵向紧凑 ---------- */
#about .about-stats {
  align-self: center;
  flex-direction: column;
  flex-wrap: nowrap;
  transform: translate(-30px, 0);
  justify-content: flex-start;
  align-items: flex-end;
  gap: 38px;
  padding-top: 4px;
}
#about .about-stats .stat-card {
  flex: 0 0 auto;
  width: 128px;
  padding: 10px 8px 12px;
}
#about .stat-number { font-size: 1.25rem; margin-bottom: 0; }
#about .stat-label { font-size: 0.6rem; }

/* ---------- 文字适配深色底（保持高可读性） ---------- */
#about .section-title,
#artists .section-title { color: #f2e7d3; }
#about .section-subtitle,
#artists .section-subtitle { color: rgba(216,184,140,0.62); }
#about .about-text {
  padding-left: 16px;
}
.about-text p { color: rgba(255,246,232,0.86); }

/* ---------- 数据卡片：深色玻璃金边 + 悬浮提亮缩放 ---------- */
#about .stat-card {
  background: rgba(38,26,16,0.55);
  border: 1px solid rgba(201,169,110,0.28);
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
  backdrop-filter: blur(6px);
}
#about .stat-card:hover {
  transform: translateY(-4px) scale(1.04);
  border-color: rgba(230,200,150,0.65);
  box-shadow: 0 10px 28px rgba(0,0,0,0.35), 0 0 14px rgba(201,169,110,0.28);
}
#about .stat-number { color: #d9b97a; }
#about .stat-label { color: rgba(255,246,232,0.72); }

/* ---------- 移动端：卡片横排居中 ---------- */
@media (max-width: 768px) {
  #about { min-height: 0; padding: 72px 0 96px; }
  #about .about-grid { grid-template-columns: 1fr; gap: 28px; }
  #about .about-text,
  #about .about-stats { grid-column: auto; }
  #about .about-stats {
    flex-direction: row;
    transform: none;
    justify-content: center;
    align-items: stretch;
    gap: 12px;
  }
  #about .about-stats .stat-card { width: auto; flex: 0 1 46%; }
}

/* ================================================
   2026-08-09 咖啡底改造：深咖渐变 + 静态鎏金 + 极轻慢动
   方案：PPT 死背景 + 稍微活一点（无重动画、无重滤镜）
   ================================================ */
#about,
#artists {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #231709 0%, #2d1f12 48%, #1a0e05 100%);
}


/* 三色飘带（更浅/更窄，肚子比窄处宽 1/3）：金 / 暖铜 / 月白，同向斜漂，8s 一轮 */
#about::before,
#artists::before {
  content: "";
  position: absolute;
  left: -20%;
  top: -20%;
  width: 140%;
  height: 140%;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%221200%22%20height=%22800%22%20viewBox=%220%200%201200%20800%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0,159.58%20C37.5,177.32%20112.5,178.15%20150,160.42%20C187.5,142.68%20262.5,141.85%20300,159.58%20C337.5,177.32%20412.5,178.15%20450,160.42%20C487.5,142.68%20562.5,141.85%20600,159.58%20C637.5,177.32%20712.5,178.15%20750,160.42%20C787.5,142.68%20862.5,141.85%20900,159.58%20C937.5,177.32%201012.5,178.15%201050,160.42%20C1087.5,142.68%201162.5,141.85%201200,159.58%20L1200,162.08%20C1162.5,178.98%201087.5,179.82%201050,161.25%20C1012.5,144.35%20937.5,143.52%20900,162.08%20C862.5,178.98%20787.5,179.82%20750,161.25%20C712.5,144.35%20637.5,143.52%20600,162.08%20C562.5,178.98%20487.5,179.82%20450,161.25%20C412.5,144.35%20337.5,143.52%20300,162.08%20C262.5,178.98%20187.5,179.82%20150,161.25%20C112.5,144.35%2037.5,143.52%200,162.08%20Z%22%20fill=%22rgba(245,225,185,0.20)%22/%3E%3Cpath%20d=%22M0,419.58%20C37.5,437.32%20112.5,438.15%20150,420.42%20C187.5,402.68%20262.5,401.85%20300,419.58%20C337.5,437.32%20412.5,438.15%20450,420.42%20C487.5,402.68%20562.5,401.85%20600,419.58%20C637.5,437.32%20712.5,438.15%20750,420.42%20C787.5,402.68%20862.5,401.85%20900,419.58%20C937.5,437.32%201012.5,438.15%201050,420.42%20C1087.5,402.68%201162.5,401.85%201200,419.58%20L1200,422.08%20C1162.5,438.98%201087.5,439.82%201050,421.25%20C1012.5,404.35%20937.5,403.52%20900,422.08%20C862.5,438.98%20787.5,439.82%20750,421.25%20C712.5,404.35%20637.5,403.52%20600,422.08%20C562.5,438.98%20487.5,439.82%20450,421.25%20C412.5,404.35%20337.5,403.52%20300,422.08%20C262.5,438.98%20187.5,439.82%20150,421.25%20C112.5,404.35%2037.5,403.52%200,422.08%20Z%22%20fill=%22rgba(225,170,140,0.16)%22/%3E%3Cpath%20d=%22M0,659.58%20C37.5,677.32%20112.5,678.15%20150,660.42%20C187.5,642.68%20262.5,641.85%20300,659.58%20C337.5,677.32%20412.5,678.15%20450,660.42%20C487.5,642.68%20562.5,641.85%20600,659.58%20C637.5,677.32%20712.5,678.15%20750,660.42%20C787.5,642.68%20862.5,641.85%20900,659.58%20C937.5,677.32%201012.5,678.15%201050,660.42%20C1087.5,642.68%201162.5,641.85%201200,659.58%20L1200,662.08%20C1162.5,678.98%201087.5,679.82%201050,661.25%20C1012.5,644.35%20937.5,643.52%20900,662.08%20C862.5,678.98%20787.5,679.82%20750,661.25%20C712.5,644.35%20637.5,643.52%20600,662.08%20C562.5,678.98%20487.5,679.82%20450,661.25%20C412.5,644.35%20337.5,643.52%20300,662.08%20C262.5,678.98%20187.5,679.82%20150,661.25%20C112.5,644.35%2037.5,643.52%200,662.08%20Z%22%20fill=%22rgba(175,200,220,0.14)%22/%3E%3C/svg%3E");
  background-size: 200% 200%;
  background-position: 5% 5%;
  transform: rotate(-30deg);
  filter: blur(0.3px);
  animation: aboutGoldFlow 8s linear infinite;
  pointer-events: none;
  z-index: 0;
}
@keyframes aboutGoldFlow {
  0%   { background-position: 5% 5%; }
  100% { background-position: 145% 145%; }
}

/* 星点（28 个）：呼吸 + 缓慢平移，5s 一轮 */
#about::after,
#artists::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(7.5px 7.5px at 5% 10%, rgba(255,240,190,1.00), rgba(255,215,140,0.42) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 94% 12%, rgba(255,214,130,1.00), rgba(255,200,110,0.36) 55%, transparent 100%),
    radial-gradient(7.5px 7.5px at 6% 88%, rgba(255,240,190,1.00), rgba(255,215,140,0.42) 55%, transparent 100%),
    radial-gradient(6.5px 6.5px at 93% 86%, rgba(230,192,120,1.00), rgba(215,170,100,0.36) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 18% 28%, rgba(255,214,130,0.86), rgba(255,200,110,0.30) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 82% 30%, rgba(255,233,176,0.86), rgba(255,215,140,0.30) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 20% 72%, rgba(255,220,150,0.80), rgba(255,200,110,0.29) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 80% 70%, rgba(255,233,176,0.80), rgba(255,215,140,0.29) 55%, transparent 100%),
    radial-gradient(5.0px 5.0px at 40% 14%, rgba(255,240,190,0.75), rgba(255,215,140,0.26) 55%, transparent 100%),
    radial-gradient(5.0px 5.0px at 60% 86%, rgba(255,240,190,0.75), rgba(255,215,140,0.26) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 35% 92%, rgba(255,214,130,0.80), rgba(255,200,110,0.29) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 65% 8%, rgba(255,214,130,0.80), rgba(255,200,110,0.29) 55%, transparent 100%),
    radial-gradient(4.5px 4.5px at 45% 50%, rgba(255,240,190,0.63), rgba(255,215,140,0.22) 55%, transparent 100%),
    radial-gradient(4.5px 4.5px at 55% 42%, rgba(255,240,190,0.63), rgba(255,215,140,0.22) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 12% 18%, rgba(255,240,190,0.92), rgba(255,215,140,0.34) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 30% 6%, rgba(255,214,130,0.86), rgba(255,200,110,0.31) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 50% 24%, rgba(255,233,176,0.90), rgba(255,215,140,0.31) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 72% 14%, rgba(255,240,190,0.92), rgba(255,215,140,0.34) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 88% 26%, rgba(255,214,130,0.90), rgba(255,200,110,0.31) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 10% 82%, rgba(255,240,190,0.92), rgba(255,215,140,0.34) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 26% 95%, rgba(255,220,150,0.90), rgba(255,200,110,0.31) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 45% 88%, rgba(255,233,176,0.90), rgba(255,215,140,0.31) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 70% 94%, rgba(255,240,190,0.92), rgba(255,215,140,0.34) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 90% 78%, rgba(255,214,130,0.90), rgba(255,200,110,0.31) 55%, transparent 100%),
    radial-gradient(5.0px 5.0px at 15% 45%, rgba(255,220,150,0.75), rgba(255,200,110,0.26) 55%, transparent 100%),
    radial-gradient(5.0px 5.0px at 85% 55%, rgba(255,233,176,0.75), rgba(255,215,140,0.26) 55%, transparent 100%),
    radial-gradient(4.5px 4.5px at 38% 52%, rgba(255,240,190,0.57), rgba(255,215,140,0.19) 55%, transparent 100%),
    radial-gradient(4.5px 4.5px at 62% 60%, rgba(255,240,190,0.57), rgba(255,215,140,0.19) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 8% 30%, rgba(255,240,190,1.0), rgba(255,215,140,0.42) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 92% 40%, rgba(255,214,130,0.92), rgba(255,200,110,0.36) 55%, transparent 100%),
    radial-gradient(5.8px 5.8px at 15% 58%, rgba(255,233,176,0.92), rgba(255,215,140,0.34) 55%, transparent 100%),
    radial-gradient(5.5px 5.5px at 85% 20%, rgba(255,240,190,1.0), rgba(255,215,140,0.42) 55%, transparent 100%),
    radial-gradient(6.0px 6.0px at 50% 4%, rgba(255,240,190,1.0), rgba(255,215,140,0.42) 55%, transparent 100%);
  background-size: 170% 170%;
  background-position: 0% 0%;
  animation: aboutStarsDrift 12s ease-in-out infinite, aboutDotsGlow 2.6s ease-in-out infinite;
  filter: drop-shadow(0 0 5px rgba(255,220,150,0.55));
  pointer-events: none;
  z-index: 0;
}
@keyframes aboutStarsDrift {
  0%, 100% { background-position: 0% 0%; }
  50%      { background-position: 7% 4%; }
}
@keyframes aboutDotsGlow {
  0%, 100% { opacity: 0.35; }
  50%      { opacity: 1; }
}

/* 内容层置于装饰之上 */
#about .about-grid,
#about .section-title,
#about .section-subtitle,
#artists .artists-grid,
#artists .section-title,
#artists .section-subtitle {
  position: relative;
  z-index: 1;
}

/* ---------- 手机端飘带：固定 3:2 比例，避免被长区块纵向拉成椭圆 ---------- */
@media (max-width: 768px) {
  #about::before,
  #artists::before {
    display: block;
    top: 110px;
    left: -40%;
    width: 180%;
    height: 120vw;
    /* 2026-10-17 手机端只留上下两条飘带（去掉中间那条暖铜）：只换图，粗细与位置不动 */
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%221200%22%20height=%22800%22%20viewBox=%220%200%201200%20800%22%20preserveAspectRatio=%22none%22%3E%3Cg%20transform=%22translate(0,50)%22%3E%3Cpath%20d=%22M0,159.58%20C37.5,177.32%20112.5,178.15%20150,160.42%20C187.5,142.68%20262.5,141.85%20300,159.58%20C337.5,177.32%20412.5,178.15%20450,160.42%20C487.5,142.68%20562.5,141.85%20600,159.58%20C637.5,177.32%20712.5,178.15%20750,160.42%20C787.5,142.68%20862.5,141.85%20900,159.58%20C937.5,177.32%201012.5,178.15%201050,160.42%20C1087.5,142.68%201162.5,141.85%201200,159.58%20L1200,162.08%20C1162.5,178.98%201087.5,179.82%201050,161.25%20C1012.5,144.35%20937.5,143.52%20900,162.08%20C862.5,178.98%20787.5,179.82%20750,161.25%20C712.5,144.35%20637.5,143.52%20600,162.08%20C562.5,178.98%20487.5,179.82%20450,161.25%20C412.5,144.35%20337.5,143.52%20300,162.08%20C262.5,178.98%20187.5,179.82%20150,161.25%20C112.5,144.35%2037.5,143.52%200,162.08%20Z%22%20fill=%22rgba(245,225,185,0.20)%22/%3E%3C/g%3E%3Cg%20transform=%22translate(0,-50)%22%3E%3Cpath%20d=%22M0,659.58%20C37.5,677.32%20112.5,678.15%20150,660.42%20C187.5,642.68%20262.5,641.85%20300,659.58%20C337.5,677.32%20412.5,678.15%20450,660.42%20C487.5,642.68%20562.5,641.85%20600,659.58%20C637.5,677.32%20712.5,678.15%20750,660.42%20C787.5,642.68%20862.5,641.85%20900,659.58%20C937.5,677.32%201012.5,678.15%201050,660.42%20C1087.5,642.68%201162.5,641.85%201200,659.58%20L1200,662.08%20C1162.5,678.98%201087.5,679.82%201050,661.25%20C1012.5,644.35%20937.5,643.52%20900,662.08%20C862.5,678.98%20787.5,679.82%20750,661.25%20C712.5,644.35%20637.5,643.52%20600,662.08%20C562.5,678.98%20487.5,679.82%20450,661.25%20C412.5,644.35%20337.5,643.52%20300,662.08%20C262.5,678.98%20187.5,679.82%20150,661.25%20C112.5,644.35%2037.5,643.52%200,662.08%20Z%22%20fill=%22rgba(175,200,220,0.14)%22/%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 100%;
    background-repeat: repeat;
    background-position: 0 0;
    animation: aboutGoldFlowMobile 20s linear infinite;
    transform: rotate(-30deg);
  }
}

@keyframes aboutGoldFlowMobile {
  from { background-position: 0 0; }
  to   { background-position: 0 -120vw; }
}