/* ==========================================================================
   hl-site.css — 慧量官网 v1 内容层样式
   加载于主题 build.min.css（Materialize 0.97.5 + ring-pink 皮肤）之后
   主色 #E03FE0 · 深紫 #7B1FA2 · 深底 #1A1A2E
   ========================================================================== */

:root {
  --hl-primary: #E03FE0;
  --hl-primary-dark: #7B1FA2;
  --hl-ink: #333333;
  --hl-ink-light: #666666;
  --hl-bg-soft: #F7F7F9;
  --hl-dark: #1A1A2E;
  --hl-radius: 14px;
  --hl-shadow: 0 6px 24px rgba(26, 26, 46, .08);
  --hl-shadow-hover: 0 14px 36px rgba(224, 63, 224, .20);
}

/* ---------- 基础 ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Roboto, sans-serif; color: var(--hl-ink); }
body > h2 { margin-top: 5.5rem; }
#services, #projects, #about { padding-bottom: 4.5rem; }

/* ---------- 导航 ---------- */
.nav-logo { width: 44px; height: 44px; border-radius: 10px; margin: 10px 8px 10px 0; box-shadow: 0 2px 10px rgba(0, 0, 0, .15); }
nav ul li a i[class^="icon-"], nav ul li a i[class*=" icon-"] {
  display: inline-block !important;
  font-size: .95rem !important;
  height: auto !important;
  line-height: inherit !important;
  margin-left: 8px;
  vertical-align: middle;
  opacity: .75;
}
nav .table-of-contents a { font-weight: 500; }

/* ---------- 首屏 ---------- */
.hero-content { position: relative; z-index: 10; width: 100%; }
.ring-pink-skin .hero h1 { font-size: clamp(2.4rem, 6.5vw, 7rem); line-height: 1.3; }
.hero .hl-em { color: var(--hl-primary); text-shadow: 0 0 26px rgba(224, 63, 224, .55); }
.hero-sub { margin: 2.4rem 0 0; color: rgba(255, 255, 255, .95); font-size: 1.1rem; letter-spacing: 5px; font-weight: 300; text-align: center; }
.hero-scroll { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 10; color: #fff; opacity: .8; transition: opacity .3s; }
.hero-scroll:hover { opacity: 1; }
.hero-scroll i { display: block !important; font-size: 2.2rem !important; height: auto !important; line-height: 1 !important; animation: hl-bounce 2.2s infinite; }
@keyframes hl-bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(10px); } }

/* ---------- 板块副标题 ---------- */
.sub-title { color: var(--hl-ink-light); font-weight: 300; font-size: 1.45rem; margin: -.5rem 0 3rem; }

/* ---------- 服务区 ---------- */
.service-group { margin-bottom: 4.5rem; }
.service-group:last-child { margin-bottom: 0; }
.group-head { display: flex; align-items: center; margin-bottom: 1.9rem; }
.group-icon { flex: 0 0 56px; width: 56px; height: 56px; border-radius: 16px; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); box-shadow: 0 8px 22px rgba(224, 63, 224, .35); margin-right: 1.2rem; }
.group-icon i { font-size: 1.6rem; }
.group-title { margin: 0; font-size: 1.65rem; font-weight: 700; color: var(--hl-ink); }
.group-desc { margin: .35rem 0 0; color: var(--hl-ink-light); font-size: 1rem; }
.hl-grid .col { padding-bottom: 1.3rem; }

/* 卡片（覆盖主题 .services .col>div 的灰底） */
#services .col > div.hl-card, #services .col > div.scheme-card { background: #fff; }
.hl-card { background: #fff; border-radius: var(--hl-radius); box-shadow: var(--hl-shadow); padding: 1.9rem 1.6rem; height: 100%; border: 1px solid rgba(0, 0, 0, .04); position: relative; overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }
.hl-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--hl-primary), var(--hl-primary-dark)); opacity: 0; transition: opacity .3s; }
.hl-card:hover { transform: translateY(-6px); box-shadow: var(--hl-shadow-hover); }
.hl-card:hover::before { opacity: 1; }
.hl-card .icon-circle { width: 58px; height: 58px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; margin-bottom: 1.15rem; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); box-shadow: 0 6px 16px rgba(224, 63, 224, .30); }
.hl-card .icon-circle i { font-size: 1.5rem; }
.hl-card h4 { margin: 0 0 .6rem; font-size: 1.25rem; font-weight: 600; color: var(--hl-ink); }
.hl-card p { margin: 0; color: var(--hl-ink-light); font-size: .95rem; line-height: 1.75; }

/* 词元方案卡片 */
.scheme-card { background: #fff; border-radius: var(--hl-radius); box-shadow: var(--hl-shadow); padding: 1.9rem 1.6rem; height: 100%; border: 1px solid rgba(0, 0, 0, .04); transition: transform .3s ease, box-shadow .3s ease; }
.scheme-card:hover { transform: translateY(-6px); box-shadow: var(--hl-shadow-hover); }
.scheme-head { display: flex; align-items: center; margin-bottom: 1.2rem; }
.scheme-head .icon-circle { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); box-shadow: 0 6px 16px rgba(224, 63, 224, .30); margin-right: 1rem; flex: 0 0 48px; }
.scheme-head .icon-circle i { font-size: 1.25rem; }
.scheme-head h4 { margin: 0; font-size: 1.3rem; font-weight: 700; color: var(--hl-ink); }
.scheme-row { display: flex; margin-top: .85rem; font-size: .93rem; }
.scheme-row .k { flex: 0 0 3.4em; color: var(--hl-primary-dark); font-weight: 600; }
.scheme-row .v { flex: 1; color: var(--hl-ink-light); line-height: 1.65; }

/* MaaS 入口 */
.maas-entry { text-align: center; margin: 2.4rem 0 .4rem; }
.maas-btn { display: inline-flex; align-items: center; padding: 1rem 2.6rem; border-radius: 999px; color: #fff; font-size: 1.05rem; font-weight: 600; letter-spacing: 1px; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); box-shadow: 0 10px 28px rgba(224, 63, 224, .40); transition: transform .3s, box-shadow .3s; }
.maas-btn:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(224, 63, 224, .50); color: #fff; }
.maas-btn i { margin-right: 12px; font-size: 1.2rem; }
.maas-note { margin-top: 1.1rem; color: var(--hl-ink-light); font-size: .9rem; }

/* ---------- 产品区 ---------- */
.product-nav { position: sticky; top: 72px; z-index: 60; display: flex; flex-wrap: wrap; justify-content: center; gap: .55rem; padding: .85rem .7rem; margin: 0 auto 3.2rem; background: rgba(255, 255, 255, .93); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: 999px; box-shadow: var(--hl-shadow); max-width: 900px; }
.product-nav a { padding: .5rem 1.15rem; border-radius: 999px; color: var(--hl-ink-light); font-size: .92rem; font-weight: 500; white-space: nowrap; transition: all .25s; }
.product-nav a:hover { color: var(--hl-primary); background: rgba(224, 63, 224, .08); }
.product-nav a.active { color: #fff; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); box-shadow: 0 6px 16px rgba(224, 63, 224, .35); }

.product-block { padding: 2.4rem 0 3.6rem; border-bottom: 1px dashed rgba(0, 0, 0, .09); }
.product-block:last-child { border-bottom: none; padding-bottom: 1rem; }
.product-tag { display: inline-block; padding: .3rem 1rem; border-radius: 999px; font-size: .8rem; font-weight: 600; color: var(--hl-primary-dark); background: rgba(224, 63, 224, .10); letter-spacing: 3px; margin-bottom: 1rem; }
.product-title { margin: 0 0 .9rem; font-size: 2.05rem; font-weight: 700; color: var(--hl-ink); }
.product-lead { margin: 0 0 1.4rem; font-size: 1.06rem; color: var(--hl-primary-dark); font-weight: 500; line-height: 1.7; }
.feature-list { margin: 0; padding: 0; list-style: none; }
.feature-list li { position: relative; padding-left: 1.75rem; margin-bottom: .7rem; color: var(--hl-ink-light); font-size: .96rem; line-height: 1.7; }
.feature-list li::before { content: ''; position: absolute; left: 0; top: .52em; width: 9px; height: 9px; border-radius: 50%; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); box-shadow: 0 0 0 3px rgba(224, 63, 224, .15); }
.product-note { display: inline-block; margin: 1.2rem 0 0; padding: .55rem 1.2rem; border-radius: 10px; background: var(--hl-bg-soft); color: var(--hl-ink-light); font-size: .88rem; border-left: 3px solid var(--hl-primary); }

.product-media { display: flex; flex-direction: column; gap: 1.1rem; }
.product-media img { width: 100%; display: block; border-radius: var(--hl-radius); box-shadow: var(--hl-shadow); border: 1px solid rgba(0, 0, 0, .06); transition: transform .35s ease; }
.product-media img:hover { transform: scale(1.015); }

/* 数据亮点 */
.stat-grid { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1.8rem 0 .6rem; }
.stat-card { flex: 1 1 150px; background: linear-gradient(165deg, #fff 40%, #FDF3FE); border: 1px solid rgba(224, 63, 224, .16); border-radius: var(--hl-radius); padding: 1.35rem 1rem; text-align: center; box-shadow: var(--hl-shadow); transition: transform .3s; }
.stat-card:hover { transform: translateY(-5px); }
.stat-num { font-size: 1.9rem; font-weight: 800; line-height: 1.25; background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.stat-label { margin-top: .45rem; font-size: .85rem; color: var(--hl-ink-light); }

/* ---------- 我们区 ---------- */
.about-intro { font-size: 1.06rem; line-height: 2.1; color: var(--hl-ink-light); text-align: justify; }
.about-block { margin-top: 3.4rem; }
.block-title { display: flex; align-items: center; font-size: 1.5rem; font-weight: 700; color: var(--hl-ink); margin: 0 0 1.5rem; }
.block-title::before { content: ''; width: 6px; height: 26px; border-radius: 3px; background: linear-gradient(180deg, var(--hl-primary), var(--hl-primary-dark)); margin-right: 14px; }
.block-desc { color: var(--hl-ink-light); margin: 0 0 1.2rem; }
.tag-wall { display: flex; flex-wrap: wrap; gap: .95rem; }
.company-tag { padding: .75rem 1.7rem; border-radius: 12px; background: #fff; box-shadow: var(--hl-shadow); border: 1px solid rgba(0, 0, 0, .05); font-weight: 700; font-size: 1.12rem; color: var(--hl-ink); transition: all .3s; }
.company-tag:hover { color: var(--hl-primary); transform: translateY(-3px); box-shadow: var(--hl-shadow-hover); }
.chip-wall { display: flex; flex-wrap: wrap; gap: .7rem; margin-bottom: .6rem; }
.hl-chip { padding: .5rem 1.15rem; border-radius: 999px; background: rgba(224, 63, 224, .08); color: var(--hl-primary-dark); font-size: .93rem; font-weight: 500; transition: all .25s; }
.hl-chip:hover { background: linear-gradient(135deg, var(--hl-primary), var(--hl-primary-dark)); color: #fff; }
.industry-grid { display: flex; flex-wrap: wrap; gap: .95rem; }
.industry-item { flex: 1 1 140px; display: flex; align-items: center; justify-content: center; gap: .65rem; padding: 1.05rem .8rem; border-radius: 12px; background: #fff; box-shadow: var(--hl-shadow); border: 1px solid rgba(0, 0, 0, .05); font-weight: 600; color: var(--hl-ink); transition: all .3s; }
.industry-item i { color: var(--hl-primary); font-size: 1.15rem; }
.industry-item:hover { transform: translateY(-4px); box-shadow: var(--hl-shadow-hover); color: var(--hl-primary-dark); }

/* ---------- 页脚 ---------- */
footer.page-footer { background-color: var(--hl-dark); margin-top: 4rem; }
footer.page-footer .footer-copyright { background-color: transparent; color: rgba(255, 255, 255, .78); }

/* ---------- 入场动效 ---------- */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .hero-scroll i { animation: none; }
}

/* ---------- 响应式 ---------- */
@media only screen and (max-width: 992px) {
  .product-nav { position: static; border-radius: 16px; }
}
@media only screen and (max-width: 600px) {
  body > h2 { margin-top: 3.5rem; }
  .product-title { font-size: 1.55rem; }
  .stat-num { font-size: 1.5rem; }
  .hero-sub { font-size: .92rem; letter-spacing: 2px; }
  .group-title { font-size: 1.35rem; }
  .sub-title { font-size: 1.2rem; }
  .industry-item { flex: 1 1 40%; }
}
