:root {  --orange: #f58433;
  --orange-dark: #d96b1a;
  --orange-light: #fff4ec;
  --ink: #0d1c2e;
  --ink2: #1e3048;
  --muted: #5a6e84;
  --slate: #f6f8fb;
  --line: rgba(13,28,46,.08);
  --white: #ffffff;
  --green: #13a878;
  --r: 14px;
  --rsm: 8px;
  --shadow: 0 4px 28px rgba(13,28,46,.08);
  --shadow-lg: 0 12px 48px rgba(13,28,46,.13);
}


.categories-section{background:var(--ink);}
.categories-section .section-tag{background:rgba(245,132,51,.15);color:var(--orange);}
.categories-section .display em,.categories-section .display{color:#fff;}

.cat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:16px;
}
.cat-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r);padding:28px 16px;
  text-align:center;cursor:pointer;
  transition:all .22s;
  text-decoration:none;
}
.cat-card:hover{
  background:rgba(245,132,51,.12);
  border-color:rgba(245,132,51,.35);
  transform:translateY(-4px);
}
.cat-card:hover .cat-icon{background:var(--orange);color:#fff;}

.cat-icon{
  width:52px;height:52px;border-radius:12px;
  background:rgba(255,255,255,.08);color:rgba(255,255,255,.7);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;margin:0 auto 14px;transition:all .22s;
}
.cat-card h5{font-size:13.5px;font-weight:500;color:rgba(255,255,255,.85);}