/* ===================== category.css — dedicated category pages ===================== */

.category-hero{
  position:relative; overflow:hidden; color:#fff; padding:54px 20px 50px;
  background:linear-gradient(160deg,var(--navy-950) 0%,var(--navy-900) 55%,var(--navy-800) 100%);
}
.category-hero-inner{
  position:relative; z-index:1; max-width:1240px; margin:0 auto;
  display:grid; grid-template-columns:1.15fr .85fr; align-items:center; gap:34px;
}
.category-hero h1{ font-size:32px; font-weight:800; margin:14px 0 12px; line-height:1.4; }
.category-hero p{ color:#c3d2f2; font-size:14.5px; max-width:460px; margin:0 0 22px; }
.category-hero-badges{ display:flex; gap:10px; flex-wrap:wrap; }
.category-hero-badges span{
  font-family:var(--font-mono); font-size:11.5px; background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2); padding:6px 13px; border-radius:50px; color:#dbe6ff;
}
.category-hero-visual{ display:flex; align-items:center; justify-content:center; }
.category-hero-visual i{ font-size:120px; opacity:.9; }

@media (max-width:860px){
  .category-hero-inner{ grid-template-columns:1fr; text-align:center; }
  .category-hero p{ margin-inline:auto; }
  .category-hero-badges{ justify-content:center; }
  .category-hero-visual{ order:-1; }
  .category-hero-visual i{ font-size:70px; }
}

/* --- theme: tools (copper/amber accent on top of the brand navy) --- */
.category-hero.theme-tool::before{
  content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:radial-gradient(2px 2px at 20px 20px, rgba(255,176,32,.35) 1px, transparent 0);
  background-size:26px 26px;
  mask-image:radial-gradient(circle at 80% 20%, black, transparent 65%);
}
.category-hero.theme-tool .category-hero-visual i{ color:var(--amber-400); }
.category-hero.theme-tool .hero-eyebrow{ color:var(--amber-300); border-color:rgba(255,176,32,.35); background:rgba(255,176,32,.1); }

/* --- theme: boards (circuit trace pattern + blue accent) --- */
.category-hero.theme-board::before{
  content:""; position:absolute; inset:0; opacity:.35; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:30px 30px;
  mask-image:radial-gradient(circle at 80% 25%, black, transparent 65%);
}
.category-hero.theme-board .category-hero-visual i{ color:var(--blue-400); }

/* --- theme: module (violet/indigo accent — signal & chips) --- */
.category-hero.theme-module::before{
  content:""; position:absolute; inset:0; opacity:.4; pointer-events:none;
  background-image:radial-gradient(circle, rgba(139,124,255,.35) 1.5px, transparent 0);
  background-size:22px 22px;
  mask-image:radial-gradient(circle at 78% 22%, black, transparent 65%);
}
.category-hero.theme-module .category-hero-visual i{ color:#a48cff; }
.category-hero.theme-module .hero-eyebrow{ color:#c9beff; border-color:rgba(139,124,255,.4); background:rgba(139,124,255,.12); }

/* --- theme: wire (teal/cyan accent — cabling & continuity) --- */
.category-hero.theme-wire::before{
  content:""; position:absolute; inset:0; opacity:.45; pointer-events:none;
  background-image:repeating-linear-gradient(90deg, rgba(45,212,191,.25) 0 2px, transparent 2px 26px);
  mask-image:radial-gradient(circle at 78% 30%, black, transparent 65%);
}
.category-hero.theme-wire .category-hero-visual i{ color:#2dd4bf; }
.category-hero.theme-wire .hero-eyebrow{ color:#7dede1; border-color:rgba(45,212,191,.4); background:rgba(45,212,191,.12); }

/* ================= FEATURE STRIP ================= */
.feature-strip{ padding:38px 20px 8px; }
.feature-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; max-width:1240px; margin:0 auto; }
.feature-card{
  background:#fff; border:1px solid var(--slate-200); border-radius:var(--radius-lg);
  padding:22px; box-shadow:var(--shadow-card); text-align:center;
}
.feature-card i{
  width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  font-size:20px; color:#fff; margin:0 auto 14px;
}
.theme-tool ~ .feature-strip .feature-card i,
.feature-card.tool i{ background:linear-gradient(135deg,#c9820a,var(--amber-400)); }
.feature-card.board i{ background:linear-gradient(135deg,var(--blue-600),var(--blue-400)); }
.feature-card.module i{ background:linear-gradient(135deg,#6d4fe0,#a48cff); }
.feature-card.wire i{ background:linear-gradient(135deg,#0d9488,#2dd4bf); }
.feature-card h4{ font-size:14.5px; margin:0 0 8px; }
.feature-card p{ font-size:12.5px; color:var(--slate-600); margin:0; }

/* ================= GUIDE / TIP BOX ================= */
.category-guide{
  max-width:1240px; margin:6px auto 0; padding:0 20px;
}
.guide-box{
  display:flex; gap:16px; align-items:flex-start; background:var(--slate-100);
  border:1px solid var(--slate-200); border-radius:var(--radius-lg); padding:22px 24px;
}
.guide-box i{ font-size:22px; color:var(--blue-600); margin-top:2px; flex-shrink:0; }
.guide-box h4{ margin:0 0 6px; font-size:14.5px; }
.guide-box p{ margin:0; font-size:13px; color:var(--slate-600); }

/* simplified toolbar without category chips, for single-category pages */
.toolbar.solo{ justify-content:flex-end; }