.bosch { padding: 28px 0 64px; }
.bosch h1 { font-size: 34px; margin: 0 0 8px; }
.bosch .lead-sklep { max-width: 720px; margin-bottom: 22px; }
.serie { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 18px 0 28px; }
.seria {
  display: block; color: #fff; border-radius: 18px; padding: 22px 22px 18px;
  text-decoration: none; min-height: 150px;
}
.seria:hover { color: #fff; filter: brightness(1.05); }
.seria.domowa { background: linear-gradient(145deg, #2f7d32, #1b5e20); }
.seria.pro { background: linear-gradient(145deg, #0d47a1, #01579b); }
.seria span { display: inline-block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.seria strong { display: block; font-size: 26px; margin: 6px 0; }
.seria em { font-style: normal; opacity: .92; }
.kat-siatka, .lista-modeli { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.kat-kafelek, .karta {
  display: flex; flex-direction: column; gap: 6px; background: #fff;
  border: 1px solid rgba(0,0,0,.08); border-radius: 16px; padding: 14px 14px 12px;
  color: var(--dark); text-decoration: none; min-height: 118px;
}
.kat-kafelek:hover, .karta:hover { color: var(--dark); border-color: var(--primary); }
.kat-kafelek b, .karta strong { font-size: 16px; line-height: 1.3; }
.kat-kafelek small, .karta em { color: var(--body); font-style: normal; }
.linia {
  align-self: flex-start; font-size: 11px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; border-radius: 999px; padding: 3px 8px; color: #fff;
}
.linia.easy { background: #7cb342; }
.linia.universal { background: #2e7d32; }
.linia.advanced { background: #1b5e20; }
.linia.ixo, .linia.psr, .linia.quigo, .linia.pst, .linia.isio, .linia.domowa { background: #558b2f; }
.linia.v12, .linia.v18, .linia.przewodowa, .linia.akumulator, .linia.ladowarka, .linia.pomiar { background: #1565c0; }
.linia.biturbo { background: #0d47a1; }
.seria.cxt { background: linear-gradient(145deg, #26a69a, #00796b); }
.seria.lxt { background: linear-gradient(145deg, #00838f, #006064); }
.seria.xgt { background: linear-gradient(145deg, #004d40, #00332c); }
.seria.siec { background: linear-gradient(145deg, #455a64, #263238); }
.linia.cxt { background: #00897b; }
.linia.lxt { background: #00838f; }
.linia.xgt { background: #004d40; }
.seria.d12, .seria.d18 { color: #1a1a1a; }
.seria.d12:hover, .seria.d18:hover { color: #1a1a1a; }
.seria.d12 { background: linear-gradient(145deg, #ffe082, #ffb300); }
.seria.d18 { background: linear-gradient(145deg, #ffb300, #ff8f00); }
.seria.d54 { background: linear-gradient(145deg, #212121, #000); }
.seria.dpower { background: linear-gradient(145deg, #424242, #212121); }
.seria.dsiec { background: linear-gradient(145deg, #5d4037, #3e2723); }
.linia.d12 { background: #ffb300; color: #1a1a1a; }
.linia.d18 { background: #ff8f00; color: #1a1a1a; }
.linia.d54 { background: #212121; }
.linia.dpower { background: #424242; }
.linia.dsiec { background: #5d4037; }
.filtry { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0 16px; }
.filtry select, .filtry input {
  border: 1px solid rgba(0,0,0,.12); border-radius: 10px; padding: 8px 10px;
  font: inherit; color: var(--dark); background: #fff;
}
.okruszki { font-size: 13px; margin-bottom: 12px; }
.karta-modelu { background: #fff; border: 1px solid rgba(0,0,0,.08); border-radius: 18px; padding: 22px; max-width: 760px; }
.karta-modelu p { margin: 0 0 10px; }
.rzad { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.przycisk, .duch {
  display: inline-block; border-radius: 999px; padding: 8px 14px; font-weight: 600; text-decoration: none;
}
.przycisk { background: var(--primary); color: #fff; }
.przycisk:hover { color: #fff; background: var(--primary-hover); }
.duch { border: 1px solid rgba(0,0,0,.15); color: var(--dark); }
.duch:hover { color: var(--dark); }
@media (max-width: 980px) {
  .kat-siatka, .lista-modeli { grid-template-columns: 1fr 1fr; }
  .serie { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .kat-siatka, .lista-modeli { grid-template-columns: 1fr; }
  .bosch h1 { font-size: 28px; }
}

.seria.ecl { background: linear-gradient(145deg, #e53935, #b71c1c); }
.seria.eex { background: linear-gradient(145deg, #c62828, #7f0000); }
.seria.epr { background: linear-gradient(145deg, #4e342e, #1b0000); }
.seria.e12 { background: linear-gradient(145deg, #ef5350, #b71c1c); }
.linia.ecl { background: #e53935; }
.linia.eex { background: #b71c1c; }
.linia.epr { background: #4e342e; }
.linia.e12 { background: #c62828; }
.seria.dx, .seria.dx:hover { color: #1a1a1a; }
.seria.dx { background: linear-gradient(145deg, #ffb74d, #f57c00); }
.seria.dxs { background: linear-gradient(145deg, #e65100, #bf360c); }
.linia.dx { background: #f57c00; color: #1a1a1a; }
.linia.dxs { background: #e65100; }
.seria.rone, .seria.rone:hover, .seria.rhp, .seria.rhp:hover, .seria.r4, .seria.r4:hover { color: #1a1a1a; }
.seria.rone { background: linear-gradient(145deg, #d4ee4a, #7cb518); }
.seria.rhp { background: linear-gradient(145deg, #aed43a, #558b00); }
.seria.r36 { background: linear-gradient(145deg, #33691e, #1b3a0a); }
.seria.r1836 { background: linear-gradient(145deg, #7cb342, #33691e); }
.seria.r4 { background: linear-gradient(145deg, #e6ee9c, #c0ca33); }
.seria.r12 { background: linear-gradient(145deg, #9e9d24, #827717); }
.seria.r14 { background: linear-gradient(145deg, #827717, #4a3f00); }
.seria.r72 { background: linear-gradient(145deg, #1b5e20, #002200); }
.seria.rsiec { background: linear-gradient(145deg, #546e7a, #263238); }
.linia.rone { background: #7cb518; color: #1a1a1a; }
.linia.rhp { background: #558b00; color: #1a1a1a; }
.linia.r36 { background: #33691e; }
.linia.r1836 { background: #558b2f; }
.linia.r4 { background: #c0ca33; color: #1a1a1a; }
.linia.r12 { background: #827717; }
.linia.r14 { background: #5d4e00; }
.linia.r72 { background: #1b5e20; }
.linia.rsiec { background: #455a64; }

.seria.ub { background: linear-gradient(145deg, #0d47a1, #01579b); }
.seria.ka, .seria.ka:hover { color: #1a1a1a; }
.seria.ka { background: linear-gradient(145deg, #fff176, #fbc02d); }
.seria.re { background: linear-gradient(145deg, #ef6c00, #e65100); }
.linia.ub { background: #0d47a1; }
.linia.ka { background: #fbc02d; color: #1a1a1a; }
.linia.re { background: #ef6c00; }