/* ============================================================
   小程序人工智能 落地页 ai.css
   ============================================================ */

/* ---------- 科技 Hero ---------- */
.tech-hero{ position:relative; padding:150px 0 90px; color:#fff; overflow:hidden;
  background:linear-gradient(135deg,#161d2b 0%,#1f2b44 55%,#2a1f33 100%); }
.tech-bg{ position:absolute; inset:0; pointer-events:none; }
.tech-bg::before{ content:""; position:absolute; top:-120px; right:-80px; width:480px; height:480px;
  background:radial-gradient(circle,rgba(225,29,46,.32),transparent 68%); }
.tech-bg::after{ content:""; position:absolute; bottom:-160px; left:-100px; width:460px; height:460px;
  background:radial-gradient(circle,rgba(86,120,220,.28),transparent 68%); }
.tech-inner{ position:relative; z-index:1; }
.tech-tags{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:26px; }
.tt-main{ font-size:13.5px; font-weight:700; color:#fff; background:linear-gradient(135deg,var(--red),var(--red-dark));
  padding:7px 16px; border-radius:20px; }
.tt-sub{ font-size:13px; color:rgba(255,255,255,.85); background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.18); padding:7px 16px; border-radius:20px; }
.tech-hero h1{ font-size:46px; font-weight:800; line-height:1.25; margin-bottom:22px; letter-spacing:1px; }
.tech-lead{ font-size:16.5px; line-height:2; color:rgba(255,255,255,.86); max-width:880px; margin-bottom:34px; }
.tech-actions{ display:flex; flex-wrap:wrap; gap:16px; margin-bottom:54px; }
.btn-light{ background:#fff; color:var(--ink); }
.btn-light:hover{ background:#f2f3f6; transform:translateY(-2px); }
.tech-stats{ display:flex; align-items:center; gap:0; flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.16); padding-top:30px; }
.tech-stats > div{ padding:0 30px; }
.tech-stats > div:first-child{ padding-left:0; }
.tech-stats strong{ display:block; font-size:30px; font-weight:800; line-height:1.1; }
.tech-stats span{ font-size:13.5px; color:rgba(255,255,255,.72); margin-top:8px; display:block; }
.tech-stats > i{ width:1px; height:42px; background:rgba(255,255,255,.2); }

/* ---------- 时间线 ---------- */
.tl{ max-width:860px; margin:0 auto; position:relative; padding-left:34px; }
.tl::before{ content:""; position:absolute; left:9px; top:8px; bottom:8px; width:2px;
  background:linear-gradient(180deg,var(--red),#e8c9cb); }
.tl-item{ position:relative; padding-bottom:34px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{ content:""; position:absolute; left:-31px; top:6px; width:14px; height:14px; border-radius:50%;
  background:#fff; border:3px solid var(--red); }
.tl-item.tl-now::before{ background:var(--red); box-shadow:0 0 0 5px rgba(225,29,46,.18); }
.tl-year{ display:inline-block; font-size:14px; font-weight:800; color:var(--red);
  background:var(--red-soft); padding:4px 14px; border-radius:16px; margin-bottom:12px; }
.tl-body{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px 26px;
  box-shadow:0 6px 20px rgba(0,0,0,.04); }
.tl-body h3{ font-size:18px; margin-bottom:8px; }
.tl-body p{ color:var(--gray); font-size:14.5px; line-height:1.85; }

/* ---------- 核心能力 ---------- */
.cap-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.cap-card{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:30px 26px; transition:.3s; }
.cap-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-hover); border-color:var(--red-soft); }
.cap-ico{ width:54px; height:54px; border-radius:14px; background:var(--red-soft); font-size:26px;
  display:flex; align-items:center; justify-content:center; margin-bottom:18px; }
.cap-card h3{ font-size:18.5px; margin-bottom:10px; }
.cap-card p{ color:var(--gray); font-size:14px; line-height:1.85; }

/* ---------- 案例 ---------- */
.case-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.case-card{ display:block; background:#fff; border:1px solid var(--line); border-radius:18px;
  padding:28px 26px; transition:.3s; height:100%; }
.case-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-hover); border-color:var(--red-soft); }
.case-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.case-tag{ font-size:12.5px; color:var(--red); background:var(--red-soft); padding:5px 12px; border-radius:16px; font-weight:600; }
.case-arrow{ color:#c2c8d2; font-size:19px; transition:.3s; }
.case-card:hover .case-arrow{ color:var(--red); transform:translate(2px,-2px); }
.case-card h3{ font-size:18px; line-height:1.5; margin-bottom:12px; }
.case-card > p{ color:var(--gray); font-size:13.8px; line-height:1.85; margin-bottom:18px; }
.case-meta{ font-size:12.8px; color:var(--gray); border-top:1px dashed var(--line); padding-top:14px; }

/* ---------- 为何选择 ---------- */
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.why-item{ background:#fff; border-radius:16px; padding:28px 26px; border:1px solid var(--line); }
.why-item span{ font-size:26px; font-weight:800; color:var(--red); opacity:.85; display:block; margin-bottom:10px; }
.why-item h3{ font-size:17.5px; margin-bottom:8px; }
.why-item p{ color:var(--gray); font-size:14px; line-height:1.8; }

/* ---------- CTA ---------- */
.coop{ background:linear-gradient(135deg,#1f2733,#2c3648); color:#fff; padding:80px 0; text-align:center; }
.coop-inner h2{ font-size:32px; font-weight:800; margin-bottom:16px; }
.coop-inner > p{ color:rgba(255,255,255,.8); font-size:15.5px; margin-bottom:34px; }
.coop-actions{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-bottom:28px; }
.btn-outline-light{ color:#fff; border:1px solid rgba(255,255,255,.5); }
.btn-outline-light:hover{ background:rgba(255,255,255,.12); border-color:#fff; }
.coop-back{ color:rgba(255,255,255,.6); font-size:14px; }
.coop-back:hover{ color:#fff; }

/* ---------- 响应式 ---------- */
@media (max-width:992px){
  .cap-grid,.case-grid,.why-grid{ grid-template-columns:repeat(2,1fr); }
  .tech-hero h1{ font-size:38px; }
}
@media (max-width:768px){
  .tech-hero{ padding:118px 0 64px; }
  .tech-hero h1{ font-size:29px; }
  .tech-lead{ font-size:14.5px; line-height:1.9; }
  .tech-actions{ gap:12px; margin-bottom:38px; }
  .tech-stats{ display:grid; grid-template-columns:1fr 1fr; gap:22px 0; }
  .tech-stats > i{ display:none; }
  .tech-stats > div{ padding:0; text-align:center; }
  .cap-grid,.case-grid,.why-grid{ grid-template-columns:1fr; }
  .tl{ padding-left:28px; }
  .coop-inner h2{ font-size:24px; }
  .coop-actions .btn{ width:100%; text-align:center; }
}
