.category-page{padding-top:24px}
.category-hero{
    background:linear-gradient(135deg,#b40000,#111827);
    color:white;
    border-radius:26px;
    padding:34px;
    margin-bottom:24px;
    box-shadow:0 16px 45px rgba(0,0,0,.12)
}
.category-hero h1{font-size:42px;margin:8px 0}
.category-hero p{font-size:17px;margin:0;color:#f3f4f6}
.breadcrumb{font-size:14px;color:#fecaca}
.breadcrumb a{color:white;font-weight:900}
.category-layout{display:grid;grid-template-columns:2fr 360px;gap:24px;align-items:start}
.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.category-card{background:white;border-radius:22px;overflow:hidden;box-shadow:0 12px 34px rgba(0,0,0,.07)}
.category-card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#e5e7eb}
.category-card-body{padding:16px}
.category-card h2{font-size:20px;line-height:1.3;margin:8px 0}
.category-card p{font-size:14px;color:#4b5563;line-height:1.55;margin:0}
.side-link{display:block;padding:13px 0;border-bottom:1px solid #eee}
.side-link:last-child{border-bottom:0}
.side-link strong{display:block;line-height:1.35}
.side-link small{display:block;color:#6b7280;margin-top:5px}
@media(max-width:900px){
    .category-layout,.category-grid{grid-template-columns:1fr}
    .category-hero{padding:24px;border-radius:20px}
    .category-hero h1{font-size:30px}
}

@media(max-width:700px){
    .category-page{
        padding:10px 10px 0!important;
    }

    .category-hero{
        padding:20px 16px!important;
        border-radius:14px!important;
        margin-bottom:14px!important;
    }

    .category-hero h1{
        font-size:27px!important;
        line-height:1.2!important;
    }

    .category-hero p{
        font-size:14px!important;
        line-height:1.5!important;
    }

    .category-layout{
        gap:14px!important;
    }

    .category-grid{
        gap:12px!important;
    }

    .category-card{
        border-radius:14px!important;
    }

    .category-card-body{
        padding:12px!important;
    }

    .category-card h2{
        font-size:16px!important;
        line-height:1.32!important;
    }

    .category-card p{
        display:none!important;
    }

    .side-link strong{
        font-size:14px!important;
    }
}

/* DailyPos custom pagination */
.singkap-pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    margin:30px auto;
    font-size:13px;
}

.singkap-page-numbers{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:5px;
}

.singkap-page-btn,
.singkap-page-number,
.singkap-page-dot{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:32px;
    height:32px;
    padding:0 16px;
    border:1px solid #e5e7eb;
    border-radius:8px;
    background:#fff;
    color:#111827;
    font-weight:700;
    text-decoration:none;
    line-height:1;
}

.singkap-page-btn{
    min-width:auto;
}

.singkap-page-number.active{
    background:#b91c1c;
    border-color:#b91c1c;
    color:#fff;
}

.singkap-page-btn.disabled,
.singkap-page-dot{
    color:#9ca3af;
    background:#f9fafb;
    cursor:not-allowed;
}

@media(max-width:768px){
    .singkap-pagination{
        gap:6px;
        font-size:12px;
    }

    .singkap-page-btn,
    .singkap-page-number,
    .singkap-page-dot{
        height:30px;
        min-width:30px;
        padding:0 16px;
        border-radius:7px;
    }
}


/* FINAL MOBILE CATEGORY LIST */
@media(max-width:767px){
  .category-grid{
      display:block !important;
      width:100% !important;
      gap:0 !important;
  }

  .category-card{
      background:#fff !important;
      border-radius:0 !important;
      box-shadow:none !important;
      overflow:visible !important;
      border-bottom:1px solid #edf0f4 !important;
      padding:0 !important;
      margin:0 !important;
  }

  .category-card a{
      display:grid !important;
      grid-template-columns:96px minmax(0,1fr) !important;
      gap:10px !important;
      align-items:start !important;
      padding:12px 0 !important;
      text-decoration:none !important;
  }

  .category-card img{
      width:96px !important;
      height:72px !important;
      min-width:96px !important;
      max-width:96px !important;
      object-fit:cover !important;
      border-radius:10px !important;
      aspect-ratio:auto !important;
      background:#e5e7eb !important;
  }

  .category-card-body{
      padding:0 !important;
      min-width:0 !important;
  }

  .category-card .meta{
      font-size:11.5px !important;
      line-height:1.2 !important;
      margin:0 0 4px !important;
      color:#6b7280 !important;
  }

  .category-card h2{
      font-size:15px !important;
      line-height:1.28 !important;
      margin:0 !important;
      font-weight:750 !important;
      display:-webkit-box !important;
      -webkit-line-clamp:3 !important;
      -webkit-box-orient:vertical !important;
      overflow:hidden !important;
      color:#111827 !important;
  }

  .category-card p{
      display:none !important;
  }
}

/* FINAL CATEGORY FULL WIDTH */
.category-layout{
    display:block !important;
}

.category-layout > section{
    width:100% !important;
    max-width:100% !important;
}

/* FINAL CATEGORY PAGINATION ONE LINE */
.category-page .singkap-pagination,
.category-page .singkap-page-numbers{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:6px !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    white-space:nowrap !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
}

.category-page .singkap-pagination::-webkit-scrollbar,
.category-page .singkap-page-numbers::-webkit-scrollbar{
    display:none !important;
}

.category-page .singkap-pagination a,
.category-page .singkap-pagination span,
.category-page .singkap-page-btn,
.category-page .singkap-page-number,
.category-page .singkap-page-dot{
    flex:0 0 auto !important;
    white-space:nowrap !important;
}

@media(max-width:767px){
  .category-page .singkap-pagination{
      justify-content:flex-start !important;
      padding:0 0 6px !important;
      margin:18px 0 10px !important;
  }
}