/* ===== WEDOS HEADER – izolováno prefixem hrd- ===== */

.hrd {
  /* transparentní – prosvítí tvoje šedá */
  border-bottom: 1px solid #e5e7eb;
  font: 15px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: #0f172a;
}
.hrd a { color: inherit; text-decoration: none !important; } /* žádné podtržení */

.hrd-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 108px 1fr; /* vlevo logo, vpravo strip */
  gap: 24px;
  align-items: center;
}

/* logo vlevo */
.hrd-brand img { display: block; width: 96px; height: auto; }

/* pás produktů vpravo: 4 stejné sloupce */
.hrd-products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 28px;        /* MEZERA mezi dlaždicemi */
}

/* jedna dlaždice */
.hrd-prod {
  position: relative;
  display: grid;
  justify-items: start;
  gap: 8px;
  padding: 4px 18px;       /* vnitřní odsazení obsahu */
  min-width: 0;            /* zabraňuje přetékání textu */
  border-left: none !important;  /* jistota – žádné zděděné bordery */
}

/* základ: čára v mezeře mezi sloupci */
.hrd-prod:not(:first-child)::before{
  content:"";
  position:absolute;
  left:-14px;           /* do column-gap */
  top:8px; bottom:8px; width:1px;
  background:#e5e7eb; z-index:0;
}
/* speciál: čára mezi #2 (Protection) a #3 (EU) blíž k EU,
   aby nezasahovala zelenou bublinu Protection */
.hrd-prod:nth-child(3)::before{ left:5px; }

/* obsah je nad čarou */
.hrd-prod > *{ position:relative; z-index:1; }

/* loga – 349×40 → zmenšíme, aby se vešla 4 vedle sebe */
.hrd-logo { height: 28px; width: auto; }

/* texty pod logy – barvy podle předlohy */
.hrd-tagline { margin: 0; font-size: 14px; line-height: 1.35; color: #162240; }
.hrd-tagline--zone span { color: #0ea5e9; }
.hrd-tagline--prot { color: #16a34a; }
.hrd-tagline--eu span { color: #2563eb; }
.hrd-tagline--online { color: #22c55e; }

/* hover – bez underline, jen jemné zvýraznění */
.hrd-prod:hover .hrd-logo { filter: brightness(1.08) saturate(1.05); }
.hrd-prod:hover .hrd-tagline { color: #0f1a3a; }

/* ===== Responsivita ===== */

/* 2 sloupce */
@media (max-width: 900px) {
  .hrd-inner { grid-template-columns: 80px 1fr; }
  .hrd-brand img { width: 80px; }

  .hrd-products{ grid-template-columns:repeat(2,minmax(0,1fr)); }

  /* začátky řádků bez svislé čáry */
  .hrd-prod:nth-child(1)::before,
  .hrd-prod:nth-child(3)::before{ display:none; } 
}

/* 1 sloupec: horizontální oddělovače */
@media (max-width: 560px) {
  .hrd-products{ grid-template-columns:1fr; }
  .hrd-prod{ padding:10px 0; }
  .hrd-prod::before{ left:0; right:0; top:0; bottom:auto; height:1px; width:auto; }
  .hrd-prod:first-child::before{ display:none; }
}

/* drobná typografie pro střední šířky */
@media (max-width: 1100px) {
  .hrd-logo { height: 26px; }
  .hrd-tagline { font-size: 13px; }
}
