
/* AC194 SIEM REAP CATEGORY CARDS */

/* Only 320px-767px, only active 2-column layout. */

@media screen and (max-width:767px) {

  html body .dir-hli > ul.ac194-siem-grid {
    display:grid!important;

    grid-template-columns:
      repeat(2,minmax(0,1fr))!important;

    gap:12px!important;
    align-items:stretch!important;

    width:100%!important;
    max-width:100%!important;
    min-width:0!important;

    margin:0!important;
    padding:0 10px!important;

    list-style:none!important;
    box-sizing:border-box!important;
  }

  html body .dir-hli > ul.ac194-siem-grid
  > li.ac194-siem-card {

    display:block!important;

    position:relative!important;
    float:none!important;
    clear:none!important;

    width:100%!important;
    max-width:100%!important;
    min-width:0!important;

    height:auto!important;
    min-height:0!important;

    margin:0!important;
    padding:0!important;

    border:1px solid #e1e8f0!important;
    border-radius:16px!important;

    background:#ffffff!important;

    box-shadow:
      0 6px 17px rgba(23,46,70,.10)!important;

    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  /* Whole card remains clickable. */

  html body .ac194-siem-card > a {

    display:flex!important;
    flex-direction:column!important;

    width:100%!important;
    height:100%!important;

    padding:0!important;
    margin:0!important;

    color:inherit!important;
    text-decoration:none!important;
  }

  html body .ac194-siem-card .dir-hli-5 {

    display:flex!important;
    flex-direction:column!important;

    width:100%!important;
    height:100%!important;

    min-width:0!important;
    min-height:0!important;

    margin:0!important;
    padding:0!important;

    border:0!important;
    border-radius:0!important;

    box-shadow:none!important;
    background:#fff!important;
    overflow:hidden!important;
  }

  /* Image wrapper */

  html body .ac194-siem-card .dir-hli-1 {

    display:block!important;
    position:relative!important;

    width:100%!important;
    max-width:100%!important;
    height:120px!important;
    min-height:120px!important;

    margin:0!important;
    padding:0!important;

    background:#f1f5f9!important;
    border:0!important;
    border-radius:0!important;

    overflow:hidden!important;
  }

  /* Original markup includes duplicate images
     inside overlays. Hide those overlays. */

  html body .ac194-siem-card .dir-hli-3,
  html body .ac194-siem-card .dir-hli-4 {
    display:none!important;
  }

  /* The original direct image remains visible. */

  html body .ac194-siem-card
  .dir-hli-1 > img {

    display:block!important;

    position:static!important;
    float:none!important;

    width:100%!important;
    max-width:100%!important;
    height:100%!important;

    min-height:0!important;

    margin:0!important;
    padding:0!important;

    object-fit:contain!important;
    object-position:center!important;

    opacity:1!important;
    visibility:visible!important;

    transform:none!important;

    border:0!important;
    border-radius:0!important;
    background:#f1f5f9!important;

    box-sizing:border-box!important;
  }

  /* Category title */

  html body .ac194-siem-card .dir-hli-2 {

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    position:static!important;

    width:100%!important;
    min-width:0!important;

    height:auto!important;
    min-height:55px!important;

    margin:0!important;
    padding:10px 7px!important;

    background:#fff!important;
    border:0!important;

    box-sizing:border-box!important;
  }

  html body .ac194-siem-card .dir-hli-2 h4 {

    display:block!important;

    width:100%!important;
    max-width:100%!important;

    margin:0!important;
    padding:0!important;

    color:#203650!important;

    font-size:clamp(12px,3.55vw,15px)!important;
    font-weight:700!important;
    line-height:1.35!important;

    text-align:center!important;

    white-space:normal!important;
    overflow-wrap:anywhere!important;

    transform:none!important;
    text-shadow:none!important;

    box-sizing:border-box!important;
  }

  html body .ac194-siem-card > a:focus-visible {
    outline:3px solid #ef9147!important;
    outline-offset:-3px!important;
  }
}

@media screen and (max-width:350px) {

  html body .dir-hli > ul.ac194-siem-grid {
    gap:9px!important;
    padding:0 7px!important;
  }

  html body .ac194-siem-card .dir-hli-1 {
    height:105px!important;
    min-height:105px!important;
  }

  html body .ac194-siem-card .dir-hli-2 {
    min-height:54px!important;
    padding:9px 5px!important;
  }

  html body .ac194-siem-card .dir-hli-2 h4 {
    font-size:12px!important;
  }
}
