/* "Danh sách dịch vụ" (trang danh mục cấp 1 ID=9, news.php nhánh $_is_l1_9) —
   nút filter dạng thẻ NGANG: icon tròn bên trái, tên + số lượng danh mục xếp
   dọc bên phải — tái dùng NGUYÊN các class con .nb-catgrid__icon/__info/
   __title/__count đã có sẵn (inan-news-blog.css, đang load trên trang), chỉ
   override layout qua scope .svc-showcase để không đụng .pf-filters__btn/
   .nb-catgrid__item gốc đang dùng chung ở nơi khác (ID=28/shortcode
   [portfolio]/mục "Khám phá theo danh mục"...). */
.svc-showcase .pf-filters__btn{display:flex;flex-direction:row;align-items:center;text-align:left;padding:10px 20px 10px 10px;gap:12px;flex:0 0 auto;width:auto;white-space:normal;border-radius:12px}
/* Icon KHONG nen (bo #eef3fd mac dinh cua .nb-catgrid__icon) — chi hien mau
   icon rieng, doc qua custom property --svc-icon-color (dat inline theo tung
   danh muc trong JS, mac dinh #005EDB neu khong co) thay vi dat thang
   "color:" inline — de trang thai active o duoi van override binh thuong
   qua CSS (khong bi ket cung boi do dac hieu cao cua inline style). */
.svc-showcase .pf-filters__btn .nb-catgrid__icon{margin-bottom:0;flex:0 0 auto;width:48px;height:48px;background:transparent;color:var(--svc-icon-color,#005EDB)}
/* Kich thuoc SVG rieng cho ngu canh nay (30x30, khac 36x36 mac dinh cua
   .nb-catgrid__icon svg) — chi anh huong SVG trong filter cua trang nay. */
.svc-showcase .pf-filters__btn .nb-catgrid__icon svg{width:30px;height:30px}
.svc-showcase .pf-filters__btn .nb-catgrid__info{align-items:flex-start;text-align:left;gap:1px}
.svc-showcase .pf-filters__btn .nb-catgrid__title{font-size:0.875rem}
/* Nut dang active: nen xanh (tu .pf-filters__btn--active goc) — icon rieng
   tung danh muc luc nay de trung mau nen, doi han sang trang cho de thay;
   .nb-catgrid__count cung mau xam co dinh (#657384), doi sang trang mo. */
.svc-showcase .pf-filters__btn--active .nb-catgrid__icon{color:#fff}
.svc-showcase .pf-filters__btn--active .nb-catgrid__count{color:rgba(255,255,255,.8)}

/* .svc-showcase mang class .pf-showcase--catpage nen dung chung breakpoint
   grid voi ID=28 (portfolio-showcase.css: <576px=1 cot, 576px=2, 768px=3,
   992px=4). Rieng "Danh sach dich vu" muon <576px van hien 2 cot (khong
   giam ve 1) — override CHI o tier <576px (bang @media(max-width:575px),
   khong dung do dac hieu don thuan) de khong lam sai lech cac tier
   576/768/992px van dang dung chung voi ID=28. */
@media(max-width:575px){
.svc-showcase.pf-showcase--catpage .pf-grid{grid-template-columns:repeat(2,1fr)}
}

/* Anh dai dien card dich vu (.pf-card__img, dung padding-hack ::before{padding-
   top:77.5%} o portfolio-showcase.css) doi thanh CUNG ty le voi anh "Dich vu
   noi bat" (.fpt-card-img, home.css, aspect-ratio:3/2) — chi scope trong
   .svc-showcase, khong dung .pf-card__img bare dang dung chung o ID=28/
   shortcode [portfolio]. Tat han ::before cu (content:none) de khong con
   spacer 77.5% xung dot voi aspect-ratio moi (ca 2 co che cung dieu khien
   chieu cao se lay gia tri lon hon, khong the chi ghi de 1 gia tri). */
.svc-showcase .pf-card__img{aspect-ratio:3/2}
.svc-showcase .pf-card__img::before{content:none}
