.sec_web_concerns {
  padding: 78px 40px 84px;
  background: #fff;

  .wrap { margin: 0 auto; max-width: 1360px; }
  .heading { text-align: center; }
  .kicker { margin-bottom: 9px; }

  h2 {
    color: #0b2344;
    font-size: 36px;
    font-weight: 800;
    line-height: 1.45em;
    letter-spacing: -.03em;

    @media (max-width: 600px) { font-size: 28px; }
    @media (max-width: 400px) { font-size: 26px; }
  }

  .heading p:last-child { margin-top: 8px; color: #617896; font-size: 14px; line-height: 1.7em; }

  .cards {
    margin-top: 42px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 13px;

    @media (max-width: 1000px) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    @media (max-width: 700px) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    @media (max-width: 480px) { margin-top: 27px; grid-template-columns: 1fr; gap: 9px; }
  }

  .card {
    padding: 29px 14px 26px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 17px;
    border: 1px solid #dbe8f8;
    border-radius: 10px;
    background: linear-gradient(145deg, #f9fcff, #f1f7ff);
    text-align: center;
    box-shadow: 0 8px 25px #3574bc08;

    p { color: #183557; font-size: 14px; font-weight: 700; line-height: 1.65em; }
    @media (max-width: 480px) { padding: 14px 20px; flex-direction: row; justify-content: flex-start; gap: 17px; text-align: left; p { font-size: 13px; } br { display: none; } }
  }

  .icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    color: #1872f2;

    svg { width: 42px; height: 42px; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
    @media (max-width: 480px) { width: 36px; height: 36px; svg { width: 33px; height: 33px; } }
  }

  @media (max-width: 800px) { padding: 60px 28px 66px; }
  @media (max-width: 600px) { padding: 49px 18px 57px; }
}
