/* ===================================================================
   PC ONLY — Ask-list grid AUTO PLAY highlight (no hover needed)
   - Highlights one card at a time, sliding red slab to the right.
   - Text becomes bold and slightly bigger while active.
   - Designed to override existing hover styles.
   =================================================================== */

@media (min-width: 768px){
  /* Reset hover emphasis (optional): keep stable look */
  #profile .about-text .ask-list.grid li:hover,
  #profile .about-text .ask-list.grid li:focus-within{
    /* neutralize previous hover-only emphasis */
    font-weight: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    background-size: 0% 100% !important;
    background-position: left center !important;
  }

  /* Base card */
  #profile .about-text .ask-list.grid li{
    position: relative;
    overflow: hidden;
    border: 2px solid #e7e7e7;
    box-shadow: 0 2px 10px rgba(0,0,0,.04);
    background:
      linear-gradient(#e53935,#e53935) no-repeat left center,
      #414244;
    background-size: 0% 100%;
    background-position: left center;
    transition:
      background-size .55s ease,
      background-position .55s ease,
      font-size .25s ease,
      font-weight .25s ease,
      letter-spacing .25s ease;
  }

  /* Active (auto-rotating) */
  #profile .about-text .ask-list.grid li.is-active{
    background-size: 39% 100% !important;
    background-position: right center !important;
    border-color: #e53935 !important;
    font-weight: 800 !important;
    font-size: calc(clamp(14px,1vw,18px) + 1px) !important;
    letter-spacing: .02em !important;
  }
}
