/* ===== AI一键建站解决方案 页专属样式 pages/aw-website.css ===== */
/* 浅色科技商务风(qibo式) · 对齐 site.css 主题 token，随后台 frontPrimaryColor 注入自动换肤 */
/* 地基类(section/section-alt/sec-head/eyebrow/section-title/section-lead/btn族/faq-list/cta-banner/inquiry-panel/anchor-row/mid-cta)由 site.css 提供 */
/* 共享视觉块(Hero玻璃链路卡)复用 solutions.css 的 cg-* 类 */
/* 命名空间 aw- = AI一键建站(aw-website) 的页面独创区块 */
/* 强调色一律走 var(--accent)/color-mix，禁止硬编码 */

/* ---- Hero：暖色日落渐变场（区别于其他 solutions 页的蓝色系）---- */
.aw-hero{--h-ink:#fff;--h-ink-soft:rgba(255,255,255,.84);--h-ink-mute:rgba(255,255,255,.62);--h-accent:#ffb347;--h-line:rgba(255,255,255,.22);--h-glass:rgba(255,255,255,.11);--h-glass-2:rgba(255,255,255,.07);background:radial-gradient(115% 115% at 84% 8%,rgba(255,255,255,.14) 0,transparent 44%),radial-gradient(95% 95% at 4% 98%,#3a1255 0,transparent 54%),linear-gradient(135deg,#1e0a2e 0%,#4a1942 38%,#8b3a52 68%,#c45a3c 100%);color:#fff;overflow:hidden;position:relative}
.aw-hero:before{background-image:repeating-linear-gradient(118deg,rgba(255,255,255,.07) 0 1px,transparent 1px 13px);content:"";-webkit-mask-image:radial-gradient(circle at 76% 16%,#000,transparent 78%);mask-image:radial-gradient(circle at 76% 16%,#000,transparent 78%);inset:0;pointer-events:none;position:absolute}
.aw-hero .wrap{position:relative;z-index:1}
.aw-hero h1,.aw-hero h2,.aw-hero h3,.aw-hero h4{color:#fff}
.aw-hero-inner{align-items:center;display:grid;gap:3.2rem;grid-template-columns:1.04fr .96fr;padding:5rem 0 4.6rem}
.aw-hero-copy .eyebrow{color:#ffb347;margin-bottom:1rem;opacity:.92}
.aw-hero-title{color:#fff;font-size:clamp(2rem,4vw,3.05rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;margin:0 0 1.1rem}
.aw-hero-title .accent{color:#ffd6a0;text-shadow:0 2px 26px rgba(255,214,160,.35)}
.aw-hero-sub{color:var(--h-ink-soft);font-size:1.05rem;line-height:1.75;margin:0 0 1.6rem;max-width:36rem}
.aw-hero-actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:1.7rem}
.aw-hero .btn{min-height:46px}
.aw-hero .btn-primary{background:#fff;border-color:transparent;box-shadow:0 12px 30px rgba(30,10,46,.34);color:#8b3a52}
.aw-hero .btn-primary:hover{background:#fff8ef;box-shadow:0 16px 36px rgba(30,10,46,.40);color:#6b2046}
.aw-hero .btn-ghost{background:rgba(255,255,255,.10);border-color:var(--h-line);color:#fff}
.aw-hero .btn-ghost:hover{background:rgba(255,255,255,.18);border-color:#fff;box-shadow:none;color:#fff}
.aw-hero-points{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;list-style:none;margin:0;padding:0}
.aw-hero-points li{align-items:center;color:var(--h-ink-mute);display:flex;font-size:.86rem;gap:.55rem}
.aw-hero-points li:before{background:#ffb347;content:"";flex-shrink:0;height:8px;transform:rotate(45deg);width:8px}

/* 增长链路可视化面板：同系磨砂玻璃卡 */
.aw-flowcard{background:var(--h-glass);border:1px solid var(--h-line);border-radius:var(--radius);backdrop-filter:blur(10px);box-shadow:0 24px 60px rgba(30,10,46,.30);overflow:hidden;padding:2rem 1.9rem;position:relative}
.aw-flowcard:before{background:linear-gradient(90deg,rgba(255,179,71,.68),transparent 72%);content:"";height:3px;left:0;position:absolute;right:0;top:0}
.aw-flowcard-title{color:var(--h-ink-mute);font-size:.74rem;font-weight:800;letter-spacing:.14em;margin-bottom:1.4rem;text-transform:uppercase}
.aw-chain{display:grid;gap:.45rem;list-style:none;margin:0;padding:0}
.aw-chain-node{align-items:center;background:var(--h-glass-2);border:1px solid var(--h-line);border-radius:var(--radius-sm);display:flex;gap:.85rem;padding:.8rem 1rem;transition:border-color .25s ease,background .25s ease,transform .25s ease}
.aw-chain-node:hover{background:rgba(255,255,255,.14);border-color:#fff;transform:translateX(4px)}
.aw-chain-ic{align-items:center;background:rgba(255,255,255,.14);border:1px solid var(--h-line);border-radius:9px;color:#fff;display:flex;flex-shrink:0;height:34px;justify-content:center;width:34px}
.aw-chain-tx b{color:#fff;display:block;font-size:.94rem;font-weight:700;line-height:1.35}
.aw-chain-tx span{color:var(--h-ink-mute);font-size:.79rem}
.aw-chain-sep{color:#ffb347;display:flex;justify-content:center;line-height:1;opacity:.6}
.aw-flowcard-foot{border-top:1px solid var(--h-line);color:var(--h-ink-soft);font-size:.84rem;line-height:1.6;margin-top:1.4rem;padding-top:1.1rem}
.aw-flowcard-foot b{color:#ffb347}

/* ---- 八大痛点：4×2 网格 ---- */
.aw-pains{display:grid;gap:1.1rem;grid-template-columns:repeat(4,1fr)}
.aw-pain{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.6rem 1.5rem;position:relative;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.aw-pain:hover{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));box-shadow:var(--shadow-md);transform:translateY(-4px)}
.aw-pain-ic{align-items:center;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);border-radius:11px;color:var(--accent);display:flex;height:42px;justify-content:center;margin-bottom:1rem;width:42px}
.aw-pain h3{font-size:1.02rem;margin:0 0 .5rem}
.aw-pain p{color:var(--muted);font-size:.88rem;line-height:1.68;margin:0}

/* ---- 两种客户双轨：左右对比大卡 ---- */
.aw-tracks{display:grid;gap:1.6rem;grid-template-columns:1fr 1fr}
.aw-track{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;overflow:hidden;position:relative;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.aw-track:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}
.aw-track.featured{border-color:color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 18px 44px color-mix(in srgb,var(--accent) 15%,transparent)}
.aw-track-ribbon{background:var(--accent);color:var(--accent-ink);font-size:.72rem;font-weight:800;letter-spacing:.08em;padding:.4rem 1rem;text-align:center}
.aw-track-head{padding:1.9rem 1.9rem 1.2rem}
.aw-track-tag{color:var(--accent);display:inline-block;font-family:var(--font-display);font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.aw-track-head h3{font-size:1.35rem;font-weight:800;margin:.5rem 0 .8rem}
.aw-track-head p{color:var(--muted);font-size:.92rem;line-height:1.72;margin:0}
.aw-track-body{border-top:1px solid var(--line);flex:1;padding:1.5rem 1.9rem}
.aw-track-list{display:grid;gap:.6rem;list-style:none;margin:0;padding:0}
.aw-track-list li{align-items:flex-start;color:var(--paper-soft);display:flex;font-size:.9rem;gap:.55rem;line-height:1.55}
.aw-track-list li:before{color:var(--accent);content:"\2713";flex-shrink:0;font-weight:80}
.aw-track-quote{background:var(--surface-alt);border-left:3px solid var(--accent);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--paper-soft);font-size:.9rem;line-height:1.65;margin:1.4rem 0 0;padding:.9rem 1.1rem}

/* ---- 六大服务支柱：3×2 图标卡 ---- */
.aw-pillars{display:grid;gap:1.2rem;grid-template-columns:repeat(3,1fr)}
.aw-pillar{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.8rem 1.7rem;position:relative;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.aw-pillar:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:var(--shadow-md);transform:translateY(-4px)}
.aw-pillar-head{align-items:center;display:flex;gap:.85rem;margin-bottom:1rem}
.aw-pillar-ic{align-items:center;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);border-radius:12px;color:var(--accent);display:flex;flex-shrink:0;height:46px;justify-content:center;width:46px}
.aw-pillar-head h3{font-size:1.1rem;margin:0}
.aw-pillar p{color:var(--muted);font-size:.9rem;line-height:1.72;margin:0}
.aw-pillar-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.9rem}
.aw-pillar-tags span{background:var(--surface-alt);border:1px solid var(--line);border-radius:999px;color:var(--paper-soft);font-size:.78rem;padding:.28rem .7rem}

/* ---- 五步建站流程：毛玻璃气泡卡 ---- */
#steps .sec-head,.aw-steps{position:relative;z-index:1}
#steps::before{content:'';position:absolute;inset:0;background:
  radial-gradient(ellipse 62% 52% at 14% 28%,color-mix(in srgb,var(--accent) 13%,transparent),transparent),
  radial-gradient(ellipse 52% 46% at 82% 68%,color-mix(in srgb,var(--accent) 10%,transparent),transparent),
  radial-gradient(ellipse 42% 36% at 48% 88%,color-mix(in srgb,var(--accent) 7%,transparent),transparent);
  pointer-events:none;z-index:0}
.aw-steps{display:grid;gap:1.2rem;grid-template-columns:repeat(5,1fr)}
.aw-step{
  background:color-mix(in srgb,var(--ink-2) 72%,transparent);
  -webkit-backdrop-filter:blur(18px) saturate(1.6);
  backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line));
  border-radius:16px;
  box-shadow:0 4px 24px color-mix(in srgb,var(--accent) 7%,transparent),inset 0 1px 0 color-mix(in srgb,white 48%,transparent);
  display:flex;flex-direction:column;padding:1.9rem 1.5rem;position:relative;overflow:hidden;
  transition:border-color .35s ease,box-shadow .35s ease,transform .35s ease}
.aw-step::before{content:'';position:absolute;width:80px;height:80px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%);
  top:-24px;right:-20px;pointer-events:none}
.aw-step::after{content:'';position:absolute;width:56px;height:56px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 11%,transparent),transparent 70%);
  bottom:-16px;left:-14px;pointer-events:none}
.aw-step:hover{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));
  box-shadow:0 10px 36px color-mix(in srgb,var(--accent) 16%,transparent),inset 0 1px 0 color-mix(in srgb,white 52%,transparent);
  transform:translateY(-6px)}
.aw-step-no{color:var(--accent);display:block;font-family:var(--font-display);font-size:.78rem;font-weight:800;letter-spacing:.14em;margin-bottom:.7rem;text-transform:uppercase}
.aw-step h3{font-size:1.06rem;margin:0 0 .55rem}
.aw-step p{color:var(--muted);font-size:.88rem;line-height:1.68;margin:0}

/* ---- 功能亮点数字带 ---- */
.aw-stats{display:grid;gap:1.2rem;grid-template-columns:repeat(4,1fr);margin-bottom:2.4rem}
.aw-stat{align-items:center;background:linear-gradient(115deg,var(--accent-soft),var(--ink-2) 62%);border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);border-radius:var(--radius);display:flex;flex-direction:column;gap:.4rem;padding:2rem 1.2rem;text-align:center}
.aw-stat-num{color:var(--accent);font-family:var(--font-display);font-size:clamp(1.8rem,3vw,2.4rem);font-weight:800;line-height:1}
.aw-stat-label{color:var(--paper-soft);font-size:.9rem;font-weight:600}

/* ---- 套餐对比表 ---- */
.aw-table{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden}
.aw-table-head{display:grid;grid-template-columns:1.6fr 1fr 1fr;border-bottom:2px solid var(--line)}
.aw-table-head span{font-size:.86rem;font-weight:800;padding:1.2rem 1.5rem}
.aw-table-head span:nth-child(2),.aw-table-head span:nth-child(3){color:var(--accent);text-align:center}
.aw-table-row{display:grid;grid-template-columns:1.6fr 1fr 1fr;border-bottom:1px solid var(--line);transition:background .2s ease}
.aw-table-row:last-child{border-bottom:0}
.aw-table-row:hover{background:var(--surface-alt)}
.aw-table-row span{font-size:.9rem;padding:1rem 1.5rem;color:var(--paper-soft);line-height:1.6}
.aw-table-row span:first-child{font-weight:600;color:var(--paper)}
.aw-table-row span:nth-child(2),.aw-table-row span:nth-child(3){text-align:center}

/* ---- AI技术优势：3列勾选卡 ---- */
.aw-techs{display:grid;gap:1rem;grid-template-columns:repeat(3,1fr)}
.aw-tech{align-items:flex-start;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius-sm);display:flex;gap:.85rem;padding:1.15rem 1.3rem;transition:border-color .3s ease}
.aw-tech:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.aw-tech-ic{align-items:center;background:var(--accent-soft);border-radius:50%;color:var(--accent);display:flex;flex-shrink:0;font-size:.78rem;font-weight:800;height:26px;justify-content:center;width:26px}
.aw-tech p{color:var(--paper-soft);font-size:.92rem;line-height:1.6;margin:0}

/* ---- 适合哪些企业：3列大卡 ---- */
.aw-fits{display:grid;gap:1.3rem;grid-template-columns:repeat(3,1fr)}
.aw-fit{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:border-color .3s ease,box-shadow .3s ease,transform .3s ease}
.aw-fit:hover{border-color:color-mix(in srgb,var(--accent) 42%,var(--line));box-shadow:var(--shadow-md);transform:translateY(-4px)}
.aw-fit-top{align-items:center;background:var(--surface-alt);border-bottom:1px solid var(--line);display:flex;gap:.85rem;padding:1.4rem 1.6rem}
.aw-fit-ic{align-items:center;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);border-radius:12px;color:var(--accent);display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}
.aw-fit-top h3{font-size:1.12rem;margin:0}
.aw-fit-body{padding:1.4rem 1.6rem 1.8rem}
.aw-fit-body p{color:var(--muted);font-size:.92rem;line-height:1.72;margin:0}

/* ---- 底部 CTA + 表单 ---- */
.aw-cta-grid{align-items:start;display:grid;gap:3rem;grid-template-columns:1fr 1fr}
.aw-contact{display:grid;gap:.8rem;margin:1.7rem 0}
.aw-contact-row{align-items:center;color:var(--paper-soft);display:flex;font-size:.94rem;gap:.7rem}
.aw-contact-row b{color:var(--accent);font-size:.8rem}
.aw-cta-btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.5rem}
.aw-form-2col{display:grid;gap:1.1rem;grid-template-columns:1fr 1fr}

/* ---- 响应式塌缩 ---- */
@media (max-width:1024px){
  .aw-hero-inner{gap:2.4rem;grid-template-columns:1fr;padding:3.6rem 0 3rem}
  .aw-pains{grid-template-columns:repeat(2,1fr)}
  .aw-tracks,.aw-pillars,.aw-cta-grid{grid-template-columns:1fr}
  .aw-steps{grid-template-columns:repeat(3,1fr)}
  .aw-stats{grid-template-columns:repeat(2,1fr)}
  .aw-table-head,.aw-table-row{grid-template-columns:1.4fr 1fr 1fr}
  .aw-table-head span,.aw-table-row span{font-size:.84rem;padding:.9rem 1rem}
  .aw-fits{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .aw-pains,.aw-techs{grid-template-columns:1fr}
  .aw-steps{grid-template-columns:1fr 1fr}
  .aw-fits{grid-template-columns:1fr}
  .aw-table-head,.aw-table-row{grid-template-columns:1.2fr 1fr 1fr}
  .aw-table-head span,.aw-table-row span{font-size:.8rem;padding:.8rem .8rem}
}
@media (max-width:560px){
  .aw-pains,.aw-stats,.aw-steps,.aw-form-2col{grid-template-columns:1fr}
  .aw-hero-actions .btn{width:100%}
  .aw-table-head,.aw-table-row{grid-template-columns:1fr;gap:0}
  .aw-table-row span{text-align:left;padding:.5rem 1.2rem}
  .aw-table-row span:nth-child(2),.aw-table-row span:nth-child(3){text-align:left}
  .aw-table-head span:nth-child(2),.aw-table-head span:nth-child(3){text-align:left}
}
@media (prefers-reduced-motion:reduce){
  .aw-pain:hover,.aw-track:hover,.aw-pillar:hover,.aw-step:hover,.aw-fit:hover,.aw-tech:hover{transform:none}
}