/* ============ Hero（首页） ============ */
.hero { padding: 180px 0 110px; text-align: center; position: relative; overflow: hidden; }
.hero .eyebrow { justify-content: center; }
.hero-title { margin: 24px auto; max-width: 880px; }
.hero .lead { color: var(--text-secondary); font-size: 19px; max-width: 660px; margin: 0 auto 40px; }
.hero-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* Intelligence Convergence（超级符号，PRD 15.2） */
.convergence {
  margin: 64px auto 0;
  max-width: 720px;
  position: relative;
  padding: 40px 0;
}
.convergence svg { width: 100%; height: auto; }


/* ============================================================
 * Hero 深海空间场（评审：强化"海云博智"气质）
 * ============================================================ */
.hero { padding: 170px 0 90px; text-align: center; position: relative; overflow: hidden; }
.hero-inner { position: relative; z-index: 2; }

.hero-ocean { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.ocean-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.ocean-lines path { fill: none; stroke-linecap: round; }
.ol1 { stroke: rgba(32, 217, 255, 0.05); stroke-width: 1.4; }
.ol2 { stroke: rgba(22, 119, 255, 0.06); stroke-width: 1.6; }
.ol3 { stroke: rgba(32, 217, 255, 0.04); stroke-width: 1; }
@keyframes ocean-drift { 0% { transform: translateX(0); } 100% { transform: translateX(-40px); } }
.ol1 { animation: ocean-drift 42s linear infinite alternate; }
.ol2 { animation: ocean-drift 58s linear infinite alternate-reverse; }
.ol3 { animation: ocean-drift 70s linear infinite alternate; }

.particle { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: rgba(32, 217, 255, 0.35); opacity: 0.25; }
@keyframes particle-float {
  0% { transform: translate(0, 0); opacity: 0.1; }
  50% { opacity: 0.4; }
  100% { transform: translate(8px, -22px); opacity: 0.1; }
}
.particle { animation: particle-float 9s ease-in-out infinite; }

/* Hero 文案三层逻辑 */
.hero .lead { margin-bottom: 10px; }
.hero .lead-sub { color: var(--text-tertiary); font-size: 15.5px; margin: 0 auto 38px; max-width: 600px; }

/* Intelligence Convergence：第二主角（35% 视觉权重 → +10% 占屏） */
.convergence { max-width: 1080px; margin: 8px auto 0; position: relative; z-index: 2; }
.convergence svg { width: 100%; height: auto; display: block; }

/* 汇聚流线微光 */
.flow-lines path { opacity: 0.85; }
@keyframes core-breathe {
  0%, 100% { transform: scale(1); opacity: 0.92; }
  50% { transform: scale(1.04); opacity: 1; }
}
.core-fill { transform-origin: 422px 185px; animation: core-breathe 6s ease-in-out infinite; }
@keyframes core-glow-pulse {
  0%, 100% { transform: scale(1); opacity: 0.45; }
  50% { transform: scale(1.1); opacity: 0.85; }
}
.core-glow { transform-origin: 422px 185px; animation: core-glow-pulse 6.5s ease-in-out infinite; }
.core-ring { transform-origin: 422px 185px; animation: core-ring-spin 24s linear infinite; }
.core-hex { transform-origin: 422px 185px; animation: core-ring-spin 32s linear infinite reverse; }
@keyframes core-ring-spin { to { transform: rotate(360deg); } }

/* 右侧能量主线：实线贯通，流动由光点表达（避免 dashoffset 动画干扰实线渲染） */

/* Scroll Hint */
.scroll-hint { margin-top: 26px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 3px; color: var(--text-tertiary); display: inline-flex; align-items: center; gap: 8px; }
.scroll-hint span { display: inline-block; width: 1px; height: 26px; background: linear-gradient(rgba(32,217,255,.6), transparent); animation: scroll-pulse 3s ease-in-out infinite; }
@keyframes scroll-pulse { 0%, 100% { transform: scaleY(0.6); opacity: 0.5; } 50% { transform: scaleY(1); opacity: 1; } }

/* 第二屏承接：跨 Section Boundary 的连续叙事 */
.brand-idea { position: relative; overflow: hidden; }
.flow-connector {
  position: absolute;
  top: -70px; left: 50%;
  width: 1px; height: 150px;
  margin-left: -0.5px;
  background: linear-gradient(rgba(32, 217, 255, 0) 0%, rgba(32, 217, 255, 0.28) 45%, rgba(32, 217, 255, 0) 100%);
  opacity: 0.7;
  animation: connector-flow 3.2s ease-in-out infinite;
}
@keyframes connector-flow {
  0%, 100% { transform: scaleY(0.7); opacity: 0.35; }
  50% { transform: scaleY(1); opacity: 0.8; }
}
.brand-idea-sub { font-size: 22px; font-weight: 600; color: var(--text-primary); margin: 6px 0 14px; letter-spacing: 0.06em; }

@media (max-width: 768px) {
  .hero { padding: 132px 0 64px; }
  .ocean-lines { opacity: 0.6; }
  .particle { display: none; }
}



/* 场景入口：Portal（去边框，大入口） */
.portal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; }
.portal { cursor: pointer; padding: 8px 4px; position: relative; transition: all var(--t-normal) var(--ease); }
.portal .p-num { font-family: var(--font-mono); font-size: 12px; letter-spacing: 3px; color: var(--text-tertiary); display: block; margin-bottom: 20px; }
.portal h3 { font-size: 25px; margin-bottom: 8px; transition: color var(--t-normal); }
.portal p { color: var(--text-tertiary); font-size: 14px; }
.portal .portal-line { height: 1px; background: var(--border-default); margin: 22px 0; transition: background var(--t-normal); }
.portal .portal-prods { display: flex; flex-direction: column; gap: 10px; }
.portal .portal-prod { display: flex; align-items: center; gap: 12px; color: var(--text-secondary); font-weight: 600; font-size: 15px; transition: color var(--t-fast); }
.portal .portal-prod .ic { color: var(--p-color); flex-shrink: 0; }
.portal .portal-go { color: var(--brand-cyan); font-size: 14px; opacity: 0; transform: translateX(-6px); transition: all var(--t-normal); }
.portal:hover h3 { color: var(--brand-cyan); }
.portal:hover .portal-line { background: var(--border-active); }
.portal:hover .portal-go { opacity: 1; transform: none; }
@media (max-width: 1024px) { .portal-grid { grid-template-columns: 1fr; gap: 30px; } }

/* Updates：Editorial 节奏（一大 + 两小，日期超大背景数字） */
.updates-editorial { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; }
.upd-feature { grid-row: span 2; background: rgba(13, 27, 42, 0.6); border: 1px solid var(--border-default); border-radius: var(--radius-lg); padding: 36px; display: flex; flex-direction: column; justify-content: flex-end; min-height: 300px; position: relative; overflow: hidden; transition: all var(--t-normal) var(--ease); }
.upd-feature:hover { border-color: var(--border-active); transform: translateY(-4px); }
.upd-feature::before { content: ''; position: absolute; inset: 0; background: radial-gradient(340px 210px at 18% 0%, rgba(32, 217, 255, 0.14), transparent 70%); }
.upd-feature .upd-date-bg { position: absolute; top: 6px; right: 10px; font-family: var(--font-mono); font-size: 76px; font-weight: 700; letter-spacing: -2px; color: var(--brand-cyan); opacity: 0.07; line-height: 1; pointer-events: none; }
.upd-feature time { font-family: var(--font-mono); font-size: 13px; letter-spacing: 2px; color: var(--brand-cyan); margin-bottom: 12px; position: relative; }
.upd-feature h3 { font-size: 31px; margin-bottom: 12px; position: relative; }
.upd-feature p { color: var(--text-secondary); font-size: 15.5px; position: relative; max-width: 460px; }
.upd-minor { background: rgba(13, 27, 42, 0.6); border: 1px solid var(--border-default); border-radius: var(--radius-card); padding: 24px; display: flex; flex-direction: column; justify-content: center; transition: all var(--t-normal) var(--ease); }
.upd-minor:hover { border-color: var(--border-active); }
.upd-minor time { font-family: var(--font-mono); font-size: 12px; color: var(--text-tertiary); margin-bottom: 8px; }
.upd-minor h4 { font-size: 16px; margin-bottom: 6px; }
.upd-minor p { color: var(--text-tertiary); font-size: 13.5px; }
@media (max-width: 768px) { .updates-editorial { grid-template-columns: 1fr; } .upd-feature .upd-date-bg { font-size: 56px; } }

/* Final CTA：Flow 回归（品牌闭环） */
.final-cta { position: relative; overflow: hidden; }
.final-cta .flow-return { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.45; pointer-events: none; }
.final-cta .flow-return path { fill: none; stroke-linecap: round; }
.final-cta .fc { text-align: center; max-width: 720px; margin-inline: auto; position: relative; z-index: 2; }


/* 1) Brand Idea 大场景：文字进入网络 */
.brand-scene { position: relative; margin-top: 16px; max-width: 1040px; margin-inline: auto; }
.brand-scene svg { width: 100%; height: auto; display: block; }
.brand-scene-title {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  pointer-events: none;
}
.brand-scene-title .h2 { font-size: clamp(26px, 3.2vw, 38px); font-weight: 700; letter-spacing: -0.01em; }
.brand-idea-sub { font-size: 19px; font-weight: 600; letter-spacing: 0.08em; color: var(--text-secondary); }
.brand-scene-title .section-sub { max-width: 460px; font-size: 15.5px; margin-top: 12px; }

/* 2) Hycore Featured 大场景（70-85vh 感，非对称左文案右 Demo） */
.featured-lg {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 56px;
  align-items: center;
  min-height: 72vh;
  padding: 72px 0;
}
.featured-lg .f-eyebrow { justify-content: flex-start; }
.featured-lg .f-tagline { font-size: clamp(30px, 4vw, 46px); font-weight: 700; line-height: 1.25; margin: 20px 0 16px; white-space: pre-line; }
.featured-lg .f-desc { color: var(--text-secondary); font-size: 17px; margin-bottom: 32px; max-width: 520px; }
.featured-lg .f-actions { display: flex; gap: 14px; flex-wrap: wrap; }


/* 8) News：左标题非对称 */
.updates-wrap { display: grid; grid-template-columns: 0.8fr 1.4fr; gap: 56px; align-items: start; max-width: 1080px; margin-inline: auto; }
.updates-wrap .updates-head { position: sticky; top: 96px; }
.updates-head .h2 { margin-top: 14px; }
.updates-editorial { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; }

/* 9) Final CTA 独立呼吸空间 */
.final-cta { padding: clamp(96px, 14vw, 180px) 0; }


/* 响应式（首页） */
@media (max-width: 1024px) {
  .featured-lg { grid-template-columns: 1fr; gap: 40px; min-height: 0; }
  .updates-wrap { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .brand-scene-title .section-sub { font-size: 14px; }
}