
/* ── статичні сторінки категорій ───────────────────────────── */
.catpg{padding:18px 0 40px}
.catpg h1{font-size:26px;font-weight:900;margin:0 0 10px;line-height:1.2}
.catpg .lead{font-size:14.5px;color:#2f5d58;line-height:1.65;max-width:92ch;margin:0 0 14px}
.catpg .ctools{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.catpg .ctools a{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border-radius:11px;
  background:#0d9488;color:#fff;font-weight:800;font-size:14px;text-decoration:none}
.catpg .ctools a.gh{background:#fff;color:#0f766e;border:1px solid #cdeae6}
/* банер категорії */
.cbanner{display:flex;align-items:center;gap:18px;border-radius:18px;padding:22px 24px;margin:0 0 16px;
  color:#fff;overflow:hidden;position:relative}
.cbanner .tx{flex:1 1 auto;min-width:0}
.cbanner h2{font-size:21px;font-weight:900;margin:0 0 10px;line-height:1.25;color:#fff}
.cbanner ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.cbanner li{background:rgba(255,255,255,.18);border-radius:999px;padding:6px 13px;font-size:12.8px;
  font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cbanner .pix{display:flex;gap:9px;flex:0 0 auto}
.cbanner .pix span{width:88px;height:88px;border-radius:13px;background:#fff;display:grid;place-items:center;
  overflow:hidden}
.cbanner .pix img{width:100%;height:100%;object-fit:contain}
.g-a{background:linear-gradient(120deg,#0f766e,#14b8a6)}
.g-b{background:linear-gradient(120deg,#b45309,#f59e0b)}
.g-c{background:linear-gradient(120deg,#15803d,#65a30d)}
.g-d{background:linear-gradient(120deg,#be185d,#f472b6)}
.g-e{background:linear-gradient(120deg,#1d4ed8,#38bdf8)}
.g-f{background:linear-gradient(120deg,#334155,#64748b)}
.g-g{background:linear-gradient(120deg,#9a3412,#fb923c)}
.g-h{background:linear-gradient(120deg,#7e22ce,#c084fc)}
.g-i{background:linear-gradient(120deg,#0e7490,#22d3ee)}
.g-j{background:linear-gradient(120deg,#b91c1c,#fb7185)}
/* стрічка умов — як у Rozetka під банером */
.cperks{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.cperks span{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #e3efed;
  border-radius:999px;padding:7px 13px;font-size:12.8px;font-weight:700;color:#2f5d58}
@media(max-width:820px){.cbanner .pix span:nth-child(3){display:none}}
@media(max-width:640px){.cbanner{flex-direction:column;align-items:flex-start;padding:18px}
  .cbanner h2{font-size:17px}.cbanner .pix{order:-1;gap:7px}
  .cbanner .pix span{width:64px;height:64px}.cbanner .pix span:nth-child(3){display:grid}
  .cbanner li{font-size:12px;padding:5px 11px}}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px}
.cgrid a{display:flex;flex-direction:column;background:#fff;border:1px solid #e3efed;border-radius:14px;
  overflow:hidden;text-decoration:none;color:inherit}
.cgrid a:hover{border-color:#0d9488}
.cgrid .ph{aspect-ratio:1/1;background:#f6faf9;display:grid;place-items:center;overflow:hidden}
.cgrid .ph img{width:100%;height:100%;object-fit:contain}
.cgrid .tt{font-size:12.8px;line-height:1.35;margin:9px 10px 4px;color:#123;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cgrid .pr{font-size:15px;font-weight:900;margin:auto 10px 11px;color:#0f766e}
.catpg .more{margin:18px 0 0;font-size:14.5px;font-weight:800}
.catpg .more a{color:#0f766e}
.sib{margin:28px 0 0}
.sib h2{font-size:17px;font-weight:900;margin:0 0 10px}
.sib .chips{display:flex;flex-wrap:wrap;gap:8px}
.sib .chips a{padding:7px 12px;border-radius:999px;background:#fff;border:1px solid #d9eceA;
  font-size:13px;font-weight:700;color:#0f766e;text-decoration:none}
.sib .chips a:hover{border-color:#0d9488}
/* хаб усіх категорій */
.hub h1{font-size:26px;font-weight:900;margin:0 0 6px}
.hub .sec{margin:22px 0 0;background:#fff;border:1px solid #e3efed;border-radius:16px;padding:18px 20px}
.hub .sec>h2{font-size:19px;font-weight:900;margin:0 0 12px}
.hub .grp{margin:0 0 14px}
.hub .grp>h3{font-size:14px;font-weight:800;color:#0f766e;margin:0 0 6px}
.hub .grp ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px}
.hub .grp li a{font-size:13.5px;color:#234;text-decoration:none}
.hub .grp li a:hover{color:#0d9488;text-decoration:underline}
.hub .n{color:#8aa;font-size:12px}
@media(max-width:700px){.catpg h1{font-size:21px}.cgrid{grid-template-columns:repeat(auto-fill,minmax(142px,1fr));gap:10px}}
