/* Horní menu: skupiny s rozbalovacím panelem (layout.mjs catNav, shop-menu.js) */
.catnav{--nav-fg:var(--fg);--nav-hov:var(--surface2);position:relative;border-top:1px solid color-mix(in srgb,var(--nav-fg) 10%,transparent)}
.t-red .catnav,.t-sport .catnav{--nav-fg:#fff;--nav-hov:#ffffff17}
.cn-in{display:flex;align-items:center;gap:2px;max-width:1240px;margin:0 auto;padding:4px 12px;min-height:46px}
.dd{position:relative}
.dd-t{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:6px 12px;border:0;border-radius:10px;background:none;color:var(--nav-fg);font:inherit;font-size:.93rem;font-weight:600;cursor:pointer;white-space:nowrap}
.dd-t .i{width:18px;height:18px;flex:none}.dd-t .i:last-child{width:14px;height:14px;opacity:.6;transition:transform .2s}
.dd-t:hover,.dd.open .dd-t{background:var(--nav-hov)}.dd.open .dd-t .i:last-child{transform:rotate(180deg)}
.dd-t .s{display:none}
.cn-sep{flex:1}
.top .catnav .cn-a{display:inline-flex;align-items:center;min-height:38px;padding:6px 12px;border-radius:10px;color:var(--nav-fg);text-decoration:none;font-size:.93rem;font-weight:600;white-space:nowrap}
.top .catnav .cn-a:hover{background:var(--nav-hov)}
.top .catnav .cn-a.b2b{border:1px solid color-mix(in srgb,var(--nav-fg) 30%,transparent);margin-left:6px}
.dd-p{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:30;min-width:330px;padding:6px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 18px 40px #0003}
.dd-p::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px}/* most pro myš mezi tlačítkem a panelem */
.dd.open .dd-p{display:block}
@media (hover:hover) and (min-width:721px){.dd:hover .dd-p,.dd:focus-within .dd-p{display:block}}
.dd-p ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.top .catnav .dd-p a{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:10px;color:var(--fg);text-decoration:none}
.top .catnav .dd-p a:hover,.top .catnav .dd-p a:focus-visible{background:var(--surface2)}
.dd-p a>.i{width:36px;height:36px;padding:8px;flex:none;border-radius:10px;background:color-mix(in srgb,var(--acc) 12%,var(--surface));color:var(--acc)}
.dd-p b{display:block;font-size:.95rem}.dd-p small{display:block;color:var(--muted);font-size:.8rem;margin-top:1px}
.dd-p .only-s{display:none}
@media (min-width:721px){.dd-p.wide{min-width:560px}.dd-p.wide ul{grid-template-columns:1fr 1fr}}
.uses{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin:8px 0 22px}
.uses a{display:flex;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--fg);text-decoration:none}.uses a:hover{border-color:var(--acc)}
.uses .i{width:40px;height:40px;padding:9px;flex:none;border-radius:12px;background:color-mix(in srgb,var(--acc) 12%,var(--surface));color:var(--acc)}.uses b{display:block}.uses small{color:var(--muted)}
@media (max-width:720px){
  .dd{position:static}
  .dd-t .l,.top .catnav .hide-s{display:none}.dd-t .s{display:inline}
  .cn-in{padding:4px 8px;gap:0}
  .dd-t{padding:6px 8px;gap:5px}.top .catnav .cn-a{padding:6px 8px}
  .dd-p{left:12px;right:12px;min-width:0;top:calc(100% - 2px)}
  .dd-p .only-s{display:block}
}
@media (max-width:420px){.dd-t .i:last-child{display:none}}