/* =====================================================================
   安阳网站建设 · anyang.css （T2 布局模板）
   布局：左文右图引入 / 双列大产业卡 / 三列顶边坑卡 / 案例缩略图行 /
        深色居中服务带 / 左粘性FAQ / 文字链城市互链
   ===================================================================== */

/* ---------- 横幅 ---------- */
.banner-city{background-image:url('../images/banner-city.jpg')}

/* ---------- 主诉求：左文右图 ---------- */
.ay-intro{background:#fff}
.ay-intro-wrap{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center}
.ay-intro-text h2{font-size:clamp(24px,2.8vw,34px);margin:14px 0 18px;line-height:1.35}
.ay-intro-text p{color:var(--c-text-2);margin-bottom:14px;font-size:15px}
.ay-intro-text a{color:var(--c-accent);font-weight:600}
.ay-intro-text .btn{margin-top:10px}
.ay-intro-media img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);aspect-ratio:3/2;object-fit:cover;width:100%;position:relative}
.ay-intro-media{position:relative}
.ay-intro-media::before{
  content:"";position:absolute;inset:-16px -16px -16px auto;right:-16px;width:60%;height:60%;
  border:2px solid var(--c-accent);border-radius:var(--radius-lg);opacity:.35;z-index:-1;
}

/* ---------- 产业：双列大卡 ---------- */
.ay-industry{background:var(--c-ice-2)}
.ay-ind-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.ay-ind-card{
  background:#fff;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);
  transition:transform var(--trans),box-shadow var(--trans);display:flex;flex-direction:column;
}
.ay-ind-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.ay-ind-card img{aspect-ratio:16/9;object-fit:cover;width:100%}
.ay-ind-body{padding:30px 32px 32px;flex:1;display:flex;flex-direction:column}
.ay-ind-no{
  align-self:flex-start;font-size:12.5px;font-weight:800;letter-spacing:1.5px;color:#fff;
  background:var(--c-grad);padding:5px 14px;border-radius:6px;margin-bottom:14px;
}
.ay-ind-body h3{font-size:21px;margin-bottom:10px}
.ay-ind-body p{color:var(--c-text-2);font-size:14.5px;flex:1}
.ay-ind-body a{margin-top:16px;font-weight:700;color:var(--c-accent);font-size:14.5px}

/* ---------- 坑：三列顶边卡 ---------- */
.ay-pit{background:#fff}
.ay-pit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ay-pit-card{
  background:var(--c-ice-2);border-radius:14px;padding:28px 24px;position:relative;
  border-top:4px solid var(--c-accent);transition:all var(--trans);
}
.ay-pit-card:hover{background:#fff;box-shadow:var(--shadow);transform:translateY(-5px)}
.ay-pit-card h3{font-size:17px;margin-bottom:10px}
.ay-pit-card p{color:var(--c-text-2);font-size:14px}

/* ---------- 案例占位行 ---------- */
.ay-cases{background:var(--c-ice-2)}
.ay-case-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ay-case-row figure{background:#fff;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.ay-case-row img{aspect-ratio:16/9;object-fit:cover;width:100%;transition:transform var(--trans)}
.ay-case-row figure:hover img{transform:scale(1.05)}
.ay-case-row figcaption{padding:16px 20px;font-weight:600;color:var(--c-primary);font-size:14.5px}
.ay-case-note{margin-top:24px;color:var(--c-muted);font-size:13.5px}

/* ---------- 服务半径：深色居中带 ---------- */
.ay-range{background:var(--c-dark);color:#D6E2F6;position:relative;overflow:hidden}
.ay-range::before{content:"";position:absolute;left:-120px;bottom:-120px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,.35),transparent 70%)}
.ay-range-inner{text-align:center;max-width:760px;position:relative;z-index:2}
.ay-range-eyebrow{background:rgba(255,255,255,.12);color:#AFC6EC}
.ay-range-inner h2{color:#fff;font-size:clamp(24px,2.8vw,32px);margin-bottom:16px}
.ay-range-inner p{color:#B9C9E8;margin-bottom:24px}
.ay-range-list{display:inline-flex;gap:0;flex-wrap:wrap;justify-content:center;margin-bottom:28px;border:1px solid rgba(255,255,255,.14);border-radius:14px;overflow:hidden}
.ay-range-list li{padding:14px 26px;font-weight:600;color:#E6EEFB;font-size:14.5px;border-right:1px solid rgba(255,255,255,.1)}
.ay-range-list li:last-child{border-right:none}
.ay-range-call{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn-line-light{border:2px solid rgba(255,255,255,.4);color:#fff;padding:13px 30px;border-radius:999px;font-weight:600;transition:all var(--trans)}
.btn-line-light:hover{background:#fff;color:var(--c-primary)}

/* ---------- FAQ：左粘性头 + 右列表 ---------- */
.ay-faq{background:#fff}
.ay-faq-wrap{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:start}
.ay-faq-side{position:sticky;top:110px}
.ay-faq-side h2{font-size:clamp(24px,2.6vw,32px);margin:14px 0 14px;line-height:1.35}
.ay-faq-side p{color:var(--c-text-2);font-size:15px}
.ay-faq-list{display:grid;gap:14px}
.faq-item{background:var(--c-ice-2);border:1px solid var(--c-line);border-radius:14px;overflow:hidden;transition:all var(--trans)}
.faq-item[open]{background:#fff;box-shadow:var(--shadow);border-color:var(--c-accent)}
.faq-item summary{
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:17px 22px;font-weight:700;color:var(--c-primary);font-size:15.5px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:22px;font-weight:400;color:var(--c-accent);transition:transform var(--trans);flex-shrink:0}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{padding:0 22px 18px;color:var(--c-text-2);font-size:14.5px}
.faq-item p a{color:var(--c-accent);font-weight:600}

/* ---------- 城市互链：文字链 ---------- */
.ay-cities{background:var(--c-ice-2);padding-top:70px;padding-bottom:70px}
.ay-city-links{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.ay-city-links a{font-weight:600;color:var(--c-primary);font-size:15.5px;border-bottom:2px solid transparent;transition:all var(--trans);padding-bottom:3px}
.ay-city-links a:hover{color:var(--c-accent);border-bottom-color:var(--c-accent)}
.ay-city-links i{width:5px;height:5px;border-radius:50%;background:var(--c-line)}

/* ---------- 响应式 ---------- */
@media (max-width:992px){
  .ay-intro-wrap,.ay-faq-wrap{grid-template-columns:1fr;gap:36px}
  .ay-faq-side{position:static}
  .ay-ind-grid{grid-template-columns:1fr}
  .ay-pit-grid{grid-template-columns:1fr 1fr}
  .ay-case-row{grid-template-columns:1fr}
  .ay-range-list li{border-right:none;border-bottom:1px solid rgba(255,255,255,.1)}
}
@media (max-width:640px){
  .ay-pit-grid{grid-template-columns:1fr}
}