/* ==========================================================================
   AI 获客 · GEO（生成式引擎优化）
   视觉基调：深墨蓝底 + 品牌蓝辉光 + 金律点缀，强调"数据在流动"的科技感
   ========================================================================== */

/* ------------------------------ 首屏 ------------------------------ */
.geo-hero{
  position:relative;overflow:hidden;
  border-radius:var(--r-xl);
  padding:34px 34px 30px;
  background:
    radial-gradient(120% 140% at 88% 8%, rgba(91,124,250,.30), transparent 58%),
    radial-gradient(90% 120% at 8% 96%, rgba(192,154,69,.14), transparent 62%),
    linear-gradient(152deg,#101A33 0%,#0C1424 52%,#0A1120 100%);
  box-shadow:var(--sh-xl);
}
/* 细网格：营造"工程化"质感，透明度压到极低避免抢内容 */
.geo-hero-grid{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(120% 100% at 50% 0%, #000 30%, transparent 82%);
  -webkit-mask-image:radial-gradient(120% 100% at 50% 0%, #000 30%, transparent 82%);
}
.geo-orb{
  position:absolute;border-radius:50%;pointer-events:none;
  filter:blur(52px);opacity:.5;
}
.geo-orb.a{width:300px;height:300px;right:-70px;top:-110px;background:#3B5BDB}
.geo-orb.b{width:230px;height:230px;left:-60px;bottom:-120px;background:#C09A45;opacity:.25}
.geo-hero-body{position:relative;z-index:1}

.geo-badge{
  display:inline-flex;align-items:center;gap:8px;
  font-size:var(--t-12);font-weight:600;letter-spacing:.05em;
  color:var(--gold-200);
  background:rgba(212,178,105,.13);
  border:1px solid rgba(212,178,105,.32);
  border-radius:var(--r-full);padding:5px 14px 5px 11px;
}
/* 示例数据标识：把「这不是真实监测结果」明写在首屏，
   免得客户把演示指标当成实际投放效果。
   深色 hero 上用浅色文字 + 金色强调，不抢主标题但一定看得见。 */
.geo-demo{
  display:flex;align-items:center;gap:6px;margin-top:11px;
  font-size:var(--t-11);color:rgba(255,255,255,.58);line-height:1.6;
}
.geo-demo b{color:var(--gold-300)}
.geo-demo svg{flex:none;opacity:.8}
.geo-badge .pulse{
  width:7px;height:7px;border-radius:50%;background:var(--gold-300);flex:none;
  box-shadow:0 0 0 0 rgba(232,205,140,.75);
  animation:geoPulse 2.2s var(--ease-out) infinite;
}
@keyframes geoPulse{
  0%{box-shadow:0 0 0 0 rgba(232,205,140,.7)}
  70%{box-shadow:0 0 0 9px rgba(232,205,140,0)}
  100%{box-shadow:0 0 0 0 rgba(232,205,140,0)}
}

.geo-hero h1{
  margin:16px 0 0;font-size:var(--t-30);font-weight:650;line-height:1.3;
  color:#fff;letter-spacing:-.01em;
}
.geo-lede{
  margin:11px 0 0;max-width:760px;
  font-size:var(--t-13);line-height:1.9;color:#A9B8D6;
}

/* ---- 核心指标 ---- */
.geo-kpis{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;margin-top:24px;
}
.geo-kpi{
  display:flex;flex-direction:column;gap:3px;
  padding:13px 15px;border-radius:var(--r-lg);
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(6px);
  transition:.2s var(--ease);
}
.geo-kpi:hover{background:rgba(255,255,255,.085);border-color:rgba(124,143,245,.42);transform:translateY(-2px)}
.geo-kpi .k{font-size:var(--t-11);color:#8395B8;letter-spacing:.02em}
.geo-kpi .v{
  font-family:var(--ff-num);font-size:var(--t-24);font-weight:700;line-height:1.25;
  background:linear-gradient(120deg,#fff,#B9C8F5);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.geo-kpi .v i{font-size:var(--t-12);font-style:normal;font-weight:600;margin-left:3px}
.geo-kpi .n{font-size:var(--t-11);color:#7F90B3}

/* ---- 按钮 ---- */
.geo-hero-act{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.geo-btn-primary{
  background:linear-gradient(135deg,var(--brand-2),var(--brand-600));
  color:#fff;border:none;box-shadow:0 10px 26px -12px rgba(91,124,250,.95);
}
.geo-btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px -12px rgba(91,124,250,1)}
.geo-btn-ghost{
  background:rgba(255,255,255,.07);color:#D9E2F7;
  border:1px solid rgba(255,255,255,.16);
}
.geo-btn-ghost:hover{background:rgba(255,255,255,.13);color:#fff}

/* 进入系统：主 CTA。深色底上用实心白对比度最高，
   若也用金色会与徽标、漏斗进度条争夺注意力 */
.geo-btn-enter{
  background:#fff;color:var(--brand-700);font-weight:650;
  border:none;text-decoration:none;
  box-shadow:0 10px 26px -12px rgba(255,255,255,.55);
}
.geo-btn-enter:hover{background:#EEF2FF;color:var(--brand-800);transform:translateY(-1px)}
.geo-btn-enter svg{opacity:.7}
.geo-entry-note{
  display:flex;align-items:center;gap:5px;
  margin-top:11px;font-size:var(--t-11);color:#8395B8;
}
.geo-entry-note b{color:var(--gold-200);font-weight:600}
.geo-entry-note svg{vertical-align:-2px;flex:none}

/* ------------------------------ 布局 ------------------------------ */
.geo-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);
  gap:16px;margin-top:16px;align-items:start;
}
.geo-card{margin-bottom:0}
.geo-main > .geo-card + .geo-card{margin-top:16px}

/* --------------------------- 引擎可见度 --------------------------- */
.geo-engines{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.geo-engine{
  padding:13px 14px;border-radius:var(--r);
  background:var(--card-2);border:1px solid var(--ink-150);
  transition:.2s var(--ease);
}
.geo-engine:hover{border-color:var(--brand-200);box-shadow:var(--sh-md);transform:translateY(-2px)}
.ge-top{display:flex;align-items:center;gap:7px}
.ge-top b{font-size:var(--t-13);color:var(--ink-900);font-weight:650}
.ge-vis{
  display:flex;align-items:baseline;gap:2px;margin:9px 0 7px;
  font-family:var(--ff-num);
}
.ge-vis b{font-size:var(--t-24);font-weight:700;color:var(--brand-600);line-height:1}
.ge-vis i{font-size:var(--t-12);font-style:normal;color:var(--brand-400);font-weight:600}
.ge-delta{
  margin-left:auto;font-size:var(--t-11);font-weight:600;
  font-family:var(--ff);
}
.ge-delta.up{color:var(--ok)}
.ge-delta.down{color:var(--danger)}

.ge-bar{
  height:6px;border-radius:var(--r-full);overflow:hidden;
  background:var(--ink-100);
}
.ge-bar.slim{height:4px;margin-top:7px}
.ge-fill{
  height:100%;border-radius:var(--r-full);
  background:linear-gradient(90deg,var(--brand-500),var(--brand-2));
  transform-origin:left;animation:geGrow .85s var(--ease-out) both;
}
@keyframes geGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ge-cite{font-size:var(--t-11);color:var(--ink-400);margin-top:7px}
.ge-cite b{color:var(--ink-700);font-family:var(--ff-num)}

/* ---------------------------- 问题覆盖 ---------------------------- */
.geo-cov{display:flex;align-items:center;gap:12px}
.geo-cov span{font-size:var(--t-12);color:var(--ink-500);white-space:nowrap}
.geo-cov b{color:var(--brand-600)}

/* ------------------------------ 漏斗 ------------------------------ */
.geo-fn + .geo-fn{margin-top:11px}
.gf-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.gf-top span{font-size:var(--t-12);color:var(--ink-500)}
.gf-top b{font-family:var(--ff-num);font-size:var(--t-15);color:var(--ink-900)}
.gf-bar{height:8px;border-radius:var(--r-full);background:var(--ink-100);overflow:hidden;margin-top:6px}
.gf-fill{
  height:100%;border-radius:var(--r-full);
  background:linear-gradient(90deg,var(--brand-600),var(--brand-3),var(--gold-300));
  transform-origin:left;animation:geGrow .9s var(--ease-out) both;
}
.gf-rate{font-size:var(--t-11);color:var(--ink-400);margin-top:5px}

/* ---------------------------- 任务队列 ---------------------------- */
.geo-task + .geo-task{margin-top:13px;padding-top:13px;border-top:1px solid var(--ink-100)}
.gt-row{display:flex;align-items:flex-start;gap:8px}
.gt-t{flex:1;min-width:0;font-size:var(--t-12);color:var(--ink-800);line-height:1.6}
.gt-meta{font-size:var(--t-11);color:var(--ink-400);margin-top:5px}

/* ---------------------------- 优化能力 ---------------------------- */
.geo-abilities{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
}
.geo-ability{
  display:flex;gap:11px;padding:14px;border-radius:var(--r);
  background:var(--card-2);border:1px solid var(--ink-150);
  transition:.2s var(--ease);
  animation:geoRise .5s var(--ease-out) both;
}
.geo-ability:hover{
  border-color:var(--brand-200);background:var(--brand-50);
  transform:translateY(-2px);box-shadow:var(--sh-md);
}
@keyframes geoRise{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.ga-ic{
  width:34px;height:34px;border-radius:11px;flex:none;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
  background:linear-gradient(135deg,var(--brand-2),var(--brand-700));
  box-shadow:0 7px 16px -8px rgba(59,91,219,.85);
}
.geo-ability b{display:block;font-size:var(--t-13);color:var(--ink-900);font-weight:650}
.geo-ability p{
  margin:4px 0 0;font-size:var(--t-11);line-height:1.75;color:var(--ink-500);
}

/* ------------------------------ 页脚 ------------------------------ */
.geo-foot{
  display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;
  margin-top:16px;padding:0 4px;
  font-size:var(--t-11);color:var(--ink-400);
}
.geo-foot svg{vertical-align:-2px;margin-right:3px}
.geo-foot b{color:var(--ink-600)}

/* ------------------------------ 响应式 ------------------------------ */
@media (max-width:1180px){
  .geo-grid{grid-template-columns:minmax(0,1fr)}
  .geo-engines{grid-template-columns:repeat(2,minmax(0,1fr))}
  .geo-abilities{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .geo-hero{padding:24px 20px}
  .geo-hero h1{font-size:var(--t-24)}
  .geo-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .geo-engines,.geo-abilities{grid-template-columns:minmax(0,1fr)}
}