/* Panel-Hintergrund "Tint" mit CI-Molekülmotiv – erzeugt aus ecount-navigation/prototype/ecn-variants.css */
.ecn-dropdown-bg { overflow: hidden; }
/* ---------- 3 · Tint: leichter Blauverlauf + Netzwerk-Motiv aus den Hero-Grafiken ---------- */
.ecn .ecn-dropdown-bg { background: linear-gradient(165deg, #eef6ff 0%, #f8fbff 38%, #fff 70%); }
.ecn .ecn-dropdown-bg::after {
  /* CI-Molekülmotiv: feste Größe, oben rechts verankert -> in jedem Panel an derselben Stelle */
  content: ""; position: absolute; top: 0; right: 0; width: 760px; height: 362px; pointer-events: none; opacity: .26;
  background: url("ci-network.svg") no-repeat right top / 100% 100%;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 22%);
  mask-image: linear-gradient(to right, transparent 0%, #000 22%);
}
.ecn .ecn-nav { --ecn-soft: rgba(44, 168, 255, .07); }
/* Lesbarkeit über dem Motiv: feiner weißer Schein um die Schrift */
.ecn .ecn-panel :is(.ecn-link-title, .ecn-link-text, .ecn-product-name, .ecn-product-tag, .ecn-eyebrow, .ecn-title, .ecn-intro, .ecn-more, .ecn-foot-link) {
  text-shadow: 0 0 2px #fff, 0 0 6px #fff, 0 0 12px rgba(255, 255, 255, .9);
}
.ecn .ecn-card { background: rgba(255, 255, 255, .62); box-shadow: inset 0 0 0 1px var(--ecn-line); }