/* Megamenü „Alle Produkte“ (Patrick 04.11.): ersetzt das seitliche Scrollen im Hauptmenü. Nur Desktop, mobil bleibt das Shop-Menü. */
.ql-mega-li,.ql-mega{display:none}
@media (min-width:992px){
  .ql-mega-li{display:block}
  #mainNavigation .ql-mega-aus{display:none!important}
  .ql-mega-btn{background:none;border:0;color:inherit;font:inherit;cursor:pointer;display:flex;align-items:center;gap:.45rem;white-space:nowrap}
  .ql-mega-btn::after{content:"";width:.5em;height:.5em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-.15em) rotate(45deg);transition:transform .15s}
  .ql-mega-btn[aria-expanded="true"]::after{transform:translateY(.1em) rotate(225deg)}
  .ql-mega{position:absolute;left:0;right:0;top:100%;z-index:1050;background:#fff;color:#0d2531;box-shadow:0 30px 60px -20px rgba(5,32,44,.45);border-top:1px solid #dbe7ea}
  .ql-mega.offen{display:block}
  .ql-mega-innen{max-width:1240px;margin:0 auto;padding:1.75rem 1.5rem 2rem;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:2rem;max-height:calc(100vh - 130px);overflow:auto}
  .ql-mega-titel{display:block;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#0a7fa3;margin-bottom:.85rem}
  .ql-mega-kacheln{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
  .ql-mega-kat{display:block;color:#0d2531;font-weight:700;line-height:1.3;text-decoration:none;border-radius:14px;overflow:hidden;border:1px solid #dbe7ea;background:#fff;transition:box-shadow .15s,transform .15s}
  .ql-mega-kat:hover,.ql-mega-kat:focus{color:#0a7fa3;text-decoration:none;box-shadow:0 10px 30px -10px rgba(5,32,44,.3);transform:translateY(-2px)}
  .ql-mega-kat img{display:block;width:100%;height:110px;object-fit:cover;background:#f2f7f8}
  .ql-mega-kat span{display:block;padding:.65rem .85rem}
  .ql-mega-seite{background:#f2f7f8;border-radius:14px;padding:1.25rem}
  .ql-mega-seite ul{list-style:none;margin:0 0 1.25rem;padding:0}
  .ql-mega-seite ul:last-child{margin-bottom:0}
  .ql-mega-seite li a{display:block;padding:.4rem 0;color:#0d2531;font-weight:500;text-decoration:none}
  .ql-mega-seite li a:hover,.ql-mega-seite li a:focus{color:#0a7fa3;text-decoration:underline}
}
/* Unter 1280 px reicht der Platz neben der Suche nur für „Alle Produkte“. */
@media (min-width:992px) and (max-width:1279.98px){#mainNavigation .ql-mega-direkt{display:none!important}}
/* Die Kopfzeile färbt Links und Texte weiß; im weißen Panel gelten eigene Farben. */
#jtl-nav-wrapper .ql-mega .ql-mega-titel{color:#0a7fa3!important}
#jtl-nav-wrapper .ql-mega .ql-mega-kat,#jtl-nav-wrapper .ql-mega .ql-mega-kat span,#jtl-nav-wrapper .ql-mega .ql-mega-seite a{color:#0d2531!important}
#jtl-nav-wrapper .ql-mega .ql-mega-kat:hover,#jtl-nav-wrapper .ql-mega .ql-mega-kat:hover span,#jtl-nav-wrapper .ql-mega .ql-mega-kat:focus span,#jtl-nav-wrapper .ql-mega .ql-mega-seite a:hover,#jtl-nav-wrapper .ql-mega .ql-mega-seite a:focus{color:#0a7fa3!important}
/* Hydroxil-Panel: eigenes Menü im selben Stil, Standard-Menü am Desktop aus */
@media (min-width:992px){
  #mainNavigation .ql-mega-direkt > .dropdown-menu{display:none!important}
  .ql-mega-innen-h{grid-template-columns:340px minmax(0,1fr)}
  .ql-mega-feature{display:block;border-radius:14px;overflow:hidden;background:#05202c;text-decoration:none}
  .ql-mega-feature img{display:block;width:100%;height:170px;object-fit:cover}
  .ql-mega-feature-text{display:block;padding:1rem 1.15rem 1.2rem}
  .ql-mega-feature-text strong,.ql-mega-feature-text span,.ql-mega-feature-text em{display:block;font-style:normal}
  .ql-mega-feature-text strong{font-size:1.35rem;font-weight:800}
  .ql-mega-feature-text span{margin-top:.1rem;font-weight:500}
  .ql-mega-feature-text em{margin-top:.75rem;font-weight:700}
  .ql-mega-feature-text em::after{content:" →"}
  .ql-mega-bereiche{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
  .ql-mega-bereich{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:58px;padding:.7rem 1rem;border:1px solid #dbe7ea;border-radius:12px;background:#fff;font-weight:600;line-height:1.3;text-decoration:none;transition:box-shadow .15s,transform .15s}
  .ql-mega-bereich::after{content:"→";flex:none}
  .ql-mega-bereich:hover,.ql-mega-bereich:focus{text-decoration:none;box-shadow:0 10px 30px -10px rgba(5,32,44,.3);transform:translateY(-2px)}
  #jtl-nav-wrapper .ql-mega .ql-mega-bereich{color:#0d2531!important}
  #jtl-nav-wrapper .ql-mega .ql-mega-bereich:hover,#jtl-nav-wrapper .ql-mega .ql-mega-bereich:focus{color:#0a7fa3!important}
  #jtl-nav-wrapper .ql-mega .ql-mega-feature-text strong,#jtl-nav-wrapper .ql-mega .ql-mega-feature-text span{color:#fff!important}
  #jtl-nav-wrapper .ql-mega .ql-mega-feature-text em{color:#b4f03a!important}
}
/* Kacheln: etwas höhere Bilder, damit Produktnamen seltener abgeschnitten werden */
@media (min-width:992px){.ql-mega-kat img{height:135px;object-position:center}}
/* Keine Scroll-Pfeile mehr in der Menüleiste; kompakte Leisten unter den Kacheln */
@media (min-width:992px){
  #mainNavigation .nav-scrollbar-arrow{display:none!important}
  .ql-mega-unten{display:flex;flex-wrap:wrap;gap:1rem 2.5rem;margin-top:1.25rem;padding-top:1.1rem;border-top:1px solid #dbe7ea}
  .ql-mega-gruppe .ql-mega-titel{margin-bottom:.4rem;text-decoration:none}
  .ql-mega-gruppe ul{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;list-style:none;margin:0;padding:0}
  .ql-mega-gruppe li a{font-weight:500;text-decoration:none}
  .ql-mega-gruppe li a:hover,.ql-mega-gruppe li a:focus{text-decoration:underline}
  #jtl-nav-wrapper .ql-mega .ql-mega-gruppe li a{color:#0d2531!important}
  #jtl-nav-wrapper .ql-mega .ql-mega-gruppe li a:hover,#jtl-nav-wrapper .ql-mega .ql-mega-gruppe li a:focus{color:#0a7fa3!important}
}
/* Bilder vollständig zeigen (Hochformat 3:4), nichts abschneiden; alle sechs Kacheln in einer Reihe */
@media (min-width:992px){
  .ql-mega-kacheln{grid-template-columns:repeat(6,minmax(0,1fr));gap:.75rem}
  .ql-mega-kat img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:center}
  .ql-mega-kat span{padding:.55rem .6rem .65rem;font-size:.82rem;hyphens:auto;overflow-wrap:break-word}
  .ql-mega-seite li a{padding:.25rem 0}
  .ql-mega-innen-h{grid-template-columns:440px minmax(0,1fr)}
  .ql-mega-feature{display:flex;align-items:stretch}
  .ql-mega-feature img{flex:none;width:210px;height:auto;aspect-ratio:3/4;object-fit:cover}
  .ql-mega-feature-text{align-self:center}
}
@media (min-width:992px) and (max-width:1279.98px){
  .ql-mega-innen{grid-template-columns:minmax(0,1fr) 230px;gap:1.25rem}
  .ql-mega-innen-h{grid-template-columns:400px minmax(0,1fr)}
  .ql-mega-feature img{width:190px}
  .ql-mega-kacheln{gap:.5rem}
  .ql-mega-kat span{font-size:.75rem;padding:.45rem}
}
