.post-slider{
        position:relative;
        width:100%;
        margin:10px 0;
      }

      .post-slider-track{
        display:flex;
        gap:12px;
        overflow-x:auto;
        scroll-behavior:smooth;
        scrollbar-width:none;
        padding:0 10px;
      }

      .post-slider-track::-webkit-scrollbar{
        display:none;
      }

      .post-card{
        flex:0 0 calc(50% - 10px);
        text-decoration:none;
        color:#222;
      }

      /* image */

      .post-thumb{
        position:relative;
        width:100%;
        aspect-ratio:16/9;
        border-radius:10px;
        overflow:hidden;
      }

      .post-thumb img{
        width:100%;
        height:100%;
        object-fit:cover;
      }

      /* overlay */

      .post-overlay{
        position:absolute;
        left:0;
        bottom:0;
        width:100%;
        padding:10px;

        font-size:13px;
        line-height:1.4;
        font-weight:700;
        color:#fff;

        background:linear-gradient(
          to top,
          rgba(0,0,0,0.65),
          rgba(0,0,0,0.35),
          rgba(0,0,0,0)
        );

        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:3;

        overflow:hidden;
        text-overflow:ellipsis;
      }

      .post-overlay{
        height:66px;
      }

      /* title */

      .post-title{
        font-size:14px;
        margin-top:6px;
        line-height:1.4;

        display:-webkit-box;
        -webkit-line-clamp:3;
        -webkit-box-orient:vertical;
        overflow:hidden;
      }

      /* tablet */

      @media (min-width:768px){
        .post-card{
          flex:0 0 calc(25% - 10px);
        }
      }

      /* laptop */

      @media (min-width:1200px){
        .post-card{
          flex:0 0 calc(14.28% - 10px);
        }
      }

      .slider-btn{
        position:absolute;
        top:48%;
        transform:translateY(-50%);
        width:21px;
        height:21px;
        border-radius:50%;
        border:none;
        background:#fff;
        box-shadow:0 2px 6px rgba(0,0,0,0.15);
        cursor:pointer;
        font-size:12px;
        color: #F54927;
        z-index:10;
        opacity: 0.85;
      }

      .slider-btn.prev{
        left:1px;
      }

      .slider-btn.next{
        right:1px;
      }
      
      .post-thumb img{
        transition:transform .4s ease;
      }

      .post-card:hover img{
        transform:scale(1.06);
      }