/* ============================================================
   企业邮箱服务 youxiang.css
   布局特征：左文右图（悬浮胶囊章）+ 两列功能清单卡 +
   横向序号条目步骤 + 通栏提示条
   ============================================================ */
.banner-tech{background-image:url('../images/banner-tech.jpg');background-size:cover;background-position:center}

/* ---------- 价值：左文右图 ---------- */
.yx-value{background:var(--c-white)}
.yx-value-wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}
.yx-value-text h2{font-size:clamp(22px,2.6vw,32px);margin:12px 0 18px}
.yx-value-text p{color:var(--c-text-2);margin-bottom:16px;font-size:15px}
.yx-value-text a{color:var(--c-accent);font-weight:600}
.yx-value-media{position:relative}
.yx-value-media img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.yx-value-chip{
  position:absolute;left:-22px;bottom:-20px;background:var(--c-grad);color:#fff;
  border-radius:14px;padding:16px 26px;box-shadow:0 14px 30px rgba(37,99,235,.35);
  display:flex;align-items:baseline;gap:10px;
}
.yx-value-chip b{font-size:30px;font-weight:800;line-height:1}
.yx-value-chip span{font-size:13px;color:#D6E2F6}

/* ---------- 功能清单：两列卡 ---------- */
.yx-feat{background:var(--c-ice-2)}
.yx-feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.yx-feat-col{
  background:#fff;border-radius:var(--radius-lg);padding:36px 34px;box-shadow:var(--shadow);
  border-top:4px solid var(--c-accent);
}
.yx-feat-col h3{font-size:19px;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--c-line)}
.yx-feat-col ul{display:grid;gap:14px}
.yx-feat-col li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;color:var(--c-text)}
.yx-feat-col li svg{width:18px;height:18px;fill:var(--c-accent);flex-shrink:0;margin-top:4px}

/* ---------- 开通流程：横向序号条目 ---------- */
.yx-open{background:var(--c-white)}
.yx-open-line{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.yx-open-item{display:flex;gap:14px;align-items:flex-start}
.yx-open-item>span{
  flex-shrink:0;width:34px;height:34px;border-radius:999px;background:var(--c-ice);
  color:var(--c-accent);font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;
}
.yx-open-item h3{font-size:15.5px;margin-bottom:4px}
.yx-open-item p{font-size:13.5px;color:var(--c-text-2);margin:0;line-height:1.6}

/* ---------- 通栏提示条 ---------- */
.yx-tip{background:var(--c-ice-2)}
.yx-tip-wrap{
  display:flex;gap:22px;align-items:flex-start;background:#fff;border-radius:var(--radius-lg);
  padding:30px 36px;box-shadow:var(--shadow);border-left:5px solid #F59E0B;
}
.yx-tip-wrap>svg{width:34px;height:34px;fill:#F59E0B;flex-shrink:0}
.yx-tip-wrap h3{font-size:17px;margin-bottom:8px}
.yx-tip-wrap p{font-size:14.5px;color:var(--c-text-2);margin:0}
.yx-tip-wrap a{color:var(--c-accent);font-weight:600}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .yx-value-wrap{grid-template-columns:1fr;gap:44px}
  .yx-feat-grid{grid-template-columns:1fr}
  .yx-open-line{grid-template-columns:repeat(2,1fr);gap:26px}
}
@media (max-width:640px){
  .yx-open-line{grid-template-columns:1fr}
  .yx-tip-wrap{flex-direction:column}
}
