* { margin: 0; padding: 0; box-sizing: border-box; }
  body { background: #F2F4FC; padding: 40px 24px; font-family: system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,'PingFang SC','Microsoft YaHei',sans-serif; color: #333; }
  .wrap { max-width: 1720px; margin: 0 auto; }
  .grid { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 32px; row-gap: 36px; }
  .card { display: flex; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 10px 30px rgba(22,42,159,.09); transition: transform .2s ease, box-shadow .2s ease; }
  .card:hover { transform: translateY(-4px); box-shadow: 0 16px 38px rgba(22,42,159,.13); }
  .card .ph { flex: 0 0 45%; background: #E7EAF9; aspect-ratio: 4 / 3; overflow: hidden; }
  .card .ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .card .b { flex: 1; min-width: 0; padding: 26px 24px 24px; display: flex; flex-direction: column; justify-content: center; }
  .card h3 { font-size: 18px; font-weight: 800; color: #142c47; line-height: 1.5; margin-bottom: 12px; }
  .card h3::before { content: ""; display: inline-block; width: 5px; height: 17px; border-radius: 3px; background: #162A9F; margin-right: 10px; vertical-align: -2px; }
  .card .ans { font-size: 14px; line-height: 1.9; color: #444; }
  .card .ans b { color: #162A9F; font-weight: 700; }
  @media (max-width: 900px) {
    .wrap { padding: 0; }
    .grid { grid-template-columns: 1fr; row-gap: 24px; }
    .card { flex-direction: column; }
    .card .ph { flex: none; width: 100%; }
  }