/* Runde 7 D: eigenes Linienmotiv je Unterseite. Alles Inline-SVG, bewegt werden nur transform und opacity; dekorative Motive sind aria-hidden. Geladen auf allen Unterseiten (nach pages.css). */
.has-mt::after{display:none!important}
.has-mt{--mtw:min(46vw,680px);--mtf:.76}
.mt{position:absolute;z-index:-1;right:calc(var(--pad)*.4);bottom:clamp(36px,5vw,84px);width:var(--mtw);aspect-ratio:800/420;color:var(--c-accent-inv);pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent 24%,#000 50%);mask-image:linear-gradient(90deg,transparent 24%,#000 50%)}
.mt-svg{width:100%;height:100%;display:block;overflow:visible}
.mt-hero-br{--mtw:min(34vw,480px)}
.mt-hero-br>.mt{aspect-ratio:400/260}
.mt-hero-region{--mtw:min(40vw,600px);--mtf:.92;--mt-h1:12ch;--mt-p:46ch}
.mt-hero-region>.mt{aspect-ratio:800/580;bottom:clamp(28px,4vw,64px);-webkit-mask-image:none;mask-image:none;pointer-events:auto}

/* gemeinsame Bausteine */
.mt-lane{opacity:.2}
.mt-dot{fill:currentColor;stroke:none}
.mt-pk{fill:currentColor;stroke:none;animation:mt-run var(--d,8s) linear infinite;opacity:0}
.mt-bad{fill:var(--c-securepoint);animation-name:mt-stop}
.mt-ring,.mt-gate-ring{fill:none;stroke:currentColor;transform-box:fill-box;transform-origin:center;animation:mt-pulse 4s ease-out infinite;opacity:0}
.mt-ring.r2{animation-delay:-2s}
.mt-arc{opacity:0;animation:mt-arc 3.4s ease-out infinite}
.mt-arc.a2{animation-delay:.5s}.mt-arc.a3{animation-delay:1s}
.mt-wave{fill:none;transform-box:fill-box;transform-origin:center;animation:mt-wave 5.7s ease-out infinite;opacity:0}
.mt-blink{fill:currentColor;stroke:none;animation:mt-blink 3.6s ease-in-out infinite}
.mt-blink.b2{animation-delay:-1.2s}.mt-blink.b3{animation-delay:-2.4s}
.mt-pk-s{fill:currentColor;stroke:none;animation:mt-up 3.2s ease-in-out infinite;opacity:0}
.mt-pk-s.p2{animation-delay:-1s}.mt-pk-s.p3{animation-delay:-2s}
.mt-cur{animation:mt-blink 2.4s ease-in-out infinite}
.mt-txt{fill:currentColor;stroke:none;font-family:var(--font-mono);font-size:18px;letter-spacing:.16em}
.mt-txt.s{font-size:14px;opacity:.75}
@keyframes mt-run{0%{transform:translate3d(0,0,0);opacity:0}8%{opacity:.95}88%{opacity:.95}100%{transform:translate3d(var(--dx,0),var(--dy,0),0);opacity:0}}
@keyframes mt-stop{0%{transform:translate3d(0,0,0);opacity:0}8%{opacity:.95}84%{opacity:.95}100%{transform:translate3d(var(--dx,0),var(--dy,0),0);opacity:0}}
@keyframes mt-pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.4);opacity:0}}
@keyframes mt-wave{0%{transform:scale(1);opacity:.55}100%{transform:scale(7);opacity:0}}
@keyframes mt-arc{0%{opacity:0}30%{opacity:.9}100%{opacity:0}}
@keyframes mt-blink{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes mt-up{0%{transform:translate3d(0,0,0);opacity:0}30%{opacity:.9}100%{transform:translate3d(0,-14px,0);opacity:0}}

/* Securepoint: Filter und Wand */
.mt-shield{opacity:.38}
.mt-wall{stroke-dasharray:3 7;opacity:.5}
.mt-gate{fill:var(--c-securepoint);stroke:none}
.mt-gate-ring{stroke:var(--c-securepoint)}

/* Leistungen: Netz, je Dienst ein kleines Motiv */
.svc-icon.mt-svc{display:block;width:88px;height:56px;margin:0 0 14px;padding:0;border:0;border-radius:0;background:none;font-size:0;line-height:0}
.svc-icon.mt-svc .mt-svg{width:88px;height:56px}
.svc-icon.mt-svc .mt-ring{animation-duration:3.4s}
.svc-icon.mt-svc .mt-pk-s{transform-box:fill-box}

/* Text bleibt vom Motiv frei (Kontrastmessung: check-contrast-hero.mjs) */
.mt-hero-net{--mt-p:44ch}
.mt-hero-const{--mtw:min(36vw,540px);--mtf:1;--mt-h1:14ch}
.mt-hero-br{--mt-h1:17ch}
@media(min-width:1201px){
  .has-mt h1{max-width:min(var(--mt-h1,20ch),calc(100% - var(--mtw)*var(--mtf) - 24px))}
  .has-mt p,.has-mt .sp-hero-badges{max-width:min(var(--mt-p,56ch),calc(100% - var(--mtw)*var(--mtf) - 24px))}
}

/* Partner: Konstellation */
.mt-hero-const .partners-band.mt-constellation{position:absolute;z-index:0;right:var(--pad);bottom:clamp(36px,5vw,84px);width:var(--mtw);aspect-ratio:100/82;margin:0;padding:0;border:0;display:block;color:var(--c-accent-inv)}
.mt-constellation .mt-svg{position:absolute;inset:0}
/* Runde 9 Punkt 4: frei stehende Logos (kein Rahmen), gleichmaessig auf einer Ellipse (Positionen wie die Linien aus _motifs.PART_POS),
   optisch gleich gross: Hoehe = 38,6 px x Seitenverhaeltnis hoch -0,35 (breite Logos niedriger, kompakte hoeher); Mitte: Nordnetic-Logo */
.mt-constellation .partners-band-logo{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:grid;place-items:center;padding:10px 12px;background:radial-gradient(closest-side,var(--c-ink) 62%,rgba(10,17,25,0));border:0;border-radius:0;--ls:1}
.mt-constellation .partners-band-logo img{height:calc(var(--lo,1) * 28px * var(--ls));width:auto;max-width:none;opacity:.88;transition:opacity .3s}
.mt-constellation .partners-band-logo:is(:hover,:focus-visible) img{opacity:1}
.mt-constellation .partners-band-logo:nth-of-type(1){--x:32%;--y:18%}.mt-constellation .partners-band-logo:nth-of-type(2){--x:68%;--y:18%}
.mt-constellation .partners-band-logo:nth-of-type(3){--x:86%;--y:50%}.mt-constellation .partners-band-logo:nth-of-type(4){--x:68%;--y:82%}
.mt-constellation .partners-band-logo:nth-of-type(5){--x:32%;--y:82%}.mt-constellation .partners-band-logo:nth-of-type(6){--x:14%;--y:50%}
.mt-hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:17%;padding:3% 2.5%;background:radial-gradient(closest-side,var(--c-ink) 70%,rgba(10,17,25,0));pointer-events:none}
.mt-hub img{display:block;width:100%;height:auto}
/* Securepoint in Rot: Logo per Maske eingefaerbt (das Bild bleibt fuer Screenreader im Baum), Linie und Punkt rot */
.mt-constellation a[href="#securepoint"]{position:absolute}
.mt-constellation a[href="#securepoint"] img{opacity:0}
.mt-constellation a[href="#securepoint"]::after{content:"";position:absolute;inset:10px 12px;background:var(--c-securepoint);-webkit-mask:url(/img/mono/securepoint-light.webp) center/contain no-repeat;mask:url(/img/mono/securepoint-light.webp) center/contain no-repeat}
.mt-constellation a[href="#securepoint"]:is(:hover,:focus-visible)::after{background:var(--c-securepoint-hi)}
.mt-const .mt-lane:nth-of-type(1){stroke:var(--c-securepoint)}
.mt-const circle.mt-pk:nth-of-type(1){fill:var(--c-securepoint)}
.mt-const :is(.mt-ring,.mt-dot){display:none}

/* Referenzen: ruhig typografisch mit Ortsbezug */
.mt-orbit{fill:none}
.mt-sweep{stroke:currentColor;opacity:.4;transform-origin:560px 250px;animation:mt-rot 48s linear infinite}
@keyframes mt-rot{to{transform:rotate(360deg)}}

/* Branchen */
.mt-br{stroke-width:1.3}
.mt-br .mt-lane{opacity:.3}
.mt-bub{fill:currentColor;stroke:none;animation:mt-bub 7s ease-in-out infinite}
@keyframes mt-bub{0%,100%{transform:translate3d(-22px,0,0)}50%{transform:translate3d(22px,0,0)}}
.mt-swing{transform-origin:364px 90px;animation:mt-swing 5s ease-in-out infinite}
@keyframes mt-swing{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.mt-tilt{transform-origin:200px 82px;animation:mt-tilt 9s ease-in-out infinite}
@keyframes mt-tilt{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
.mt-spin{transform-origin:300px 90px;animation:mt-rot 26s linear infinite}
.mt-box{animation:mt-belt 9s linear infinite;opacity:0}
.mt-box.b2{animation-delay:-4.5s}
@keyframes mt-belt{0%{transform:translate3d(0,0,0);opacity:0}8%{opacity:1}88%{opacity:1}100%{transform:translate3d(190px,0,0);opacity:0}}
.mt-wv{animation:mt-wv 16s linear infinite}
@keyframes mt-wv{to{transform:translate3d(-120px,0,0)}}
.mt-win{animation:mt-win 7s ease-in-out infinite;opacity:.3}
.mt-win.w2{animation-delay:-1.8s}.mt-win.w3{animation-delay:-3.6s}.mt-win.w4{animation-delay:-5.4s}
@keyframes mt-win{0%,100%{opacity:.25}50%{opacity:1}}
.mt-check{animation:mt-blink 4s ease-in-out infinite}
.mt-pulse{stroke-width:2.2}
.mt-clip{animation:mt-sweep 4.8s linear infinite}
@keyframes mt-sweep{from{transform:translate3d(0,0,0)}to{transform:translate3d(460px,0,0)}}

/* Kontakt */
.mt-ct{stroke-width:1.2}

/* Karte der Region (Ueber uns), nutzt die Bausteine der Insel-Karte (islands.css) */
.mt-region .isle-map.region{position:relative;width:100%;aspect-ratio:800/580;-webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 76%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000 74%,transparent);mask-image:linear-gradient(to right,transparent,#000 14%,#000 76%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000 74%,transparent)}
.rg-town .dot{fill:var(--c-accent-inv)}
.rg-town .ring{fill:none;stroke:var(--c-accent-inv);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:isle-pulse 4s ease-out infinite}
.rg-town:nth-child(2) .ring{animation-delay:-1.4s}.rg-town:nth-child(3) .ring{animation-delay:-2.7s}
.isle-lbl.rg-l{transform:translate(calc(-100% - 14px),-50%)}
.isle-lbl.rg-r{transform:translate(14px,-50%)}
.isle-lbl.rg-c{transform:translate(-50%,-50%);color:var(--c-beige-mute)}

/* Google-Karte: erst nach Klick */
.map-wrap{background:none}
.map-gate{position:relative;min-height:340px;display:grid;place-items:center;padding:clamp(24px,4vw,48px);background:radial-gradient(ellipse 60% 70% at 50% 40%,rgba(98,168,244,.07),transparent 70%),repeating-linear-gradient(0deg,transparent 0 31px,rgba(217,214,195,.04) 31px 32px),repeating-linear-gradient(90deg,transparent 0 31px,rgba(217,214,195,.035) 31px 32px)}
.map-gate-inner{max-width:52ch;text-align:left;display:grid;gap:20px;justify-items:start}
.map-gate-inner p{margin:0;font-size:.9375rem;color:var(--mute)}
.map-gate.is-live{display:block;padding:0;background:none}
.map-gate iframe{width:100%;height:420px;border:0;display:block;filter:grayscale(.2) contrast(1.05)}

/* schmale Ansicht (bis 1200 px): Motiv unter dem Text, kein Text ueber Linien */
@media(max-width:1200px){
  .has-mt{display:flex!important;flex-direction:column;align-items:flex-start}
  .has-mt>.mt,.mt-hero-br>.mt,.mt-hero-region>.mt{position:relative;order:9;right:auto;bottom:auto;width:100%;margin-top:clamp(32px,8vw,56px);-webkit-mask-image:none;mask-image:none}
  .mt-hero-br>.mt{max-width:360px}
  .mt-hero-region>.mt,.mt-hero-const .partners-band.mt-constellation,.has-mt>.mt:not(.mt-region){max-width:620px}
  .mt-hero-const .partners-band.mt-constellation{position:relative;right:auto;bottom:auto;order:9;width:100%;margin-top:clamp(32px,8vw,56px)}
  .mt-constellation .partners-band-logo{padding:6px 8px;--ls:.72}
  .mt-constellation a[href="#securepoint"]::after{inset:6px 8px}
}
@media(prefers-reduced-motion:reduce){
  .mt *,.mt-svg *,.svc-icon.mt-svc *{animation:none!important}
  .mt-pk,.mt-box{opacity:.7}.mt-arc{opacity:.6}.mt-ring,.mt-wave,.mt-gate-ring{opacity:.35}.mt-win{opacity:.6}.mt-pk-s{opacity:.6}
}

/* Securepoint: Produktpackungen als ruhige Buehne (Licht von oben, Standlinie, Schatten) */
.sp-carousel-track{gap:0}
.sp-carousel-item{width:clamp(210px,21vw,290px);border:0!important;border-radius:0!important;overflow:visible;background:none}
.sp-carousel-img{position:relative;height:clamp(210px,22vw,300px);display:grid;place-items:end center;padding:8px 0 12px;border-bottom:1px solid var(--line);background:radial-gradient(ellipse 62% 70% at 50% 50%,rgba(98,168,244,.11),transparent 72%)}
.sp-carousel-item .sp-carousel-img img{position:relative;z-index:1;width:auto;height:100%;max-width:92%;object-fit:contain;transition:transform .6s var(--ease)}
.sp-carousel-img::after{content:"";position:absolute;left:14%;right:14%;bottom:4px;height:14px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.6),transparent 70%)}
.sp-carousel-item:hover .sp-carousel-img img{transform:translate3d(0,-6px,0)}
.sp-carousel-item h3{margin:30px 0 4px;padding-inline:14px;font-weight:300;font-size:1.0625rem}
.sp-carousel-item span{display:block;padding-inline:14px;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
@media(max-width:900px){.mt-region .isle-lbl{font-size:.625rem}}

/* Runde 8 Punkt 6: Leistungen-Emblem (Bildmarke mit Stationsknoten), ohne Verblendung; Text bleibt vollstaendig frei */
.mt-hero-emblem{--mtw:min(44vw,660px);--mtf:1.04}
.mt-hero-emblem>.mt{-webkit-mask-image:none;mask-image:none}
.mt-emblem .em-mark{opacity:.62;animation:em-breathe 7s ease-in-out infinite}
@keyframes em-breathe{0%,100%{opacity:.5}50%{opacity:.72}}
.mt-emblem .em-web{opacity:.28}
.mt-emblem .em-node{fill:var(--c-accent-inv)}
.em-lbl{position:absolute;left:var(--x);top:var(--y);font-family:var(--font-mono);font-size:clamp(.5625rem,.4rem + .35vw,.75rem);letter-spacing:.12em;text-transform:uppercase;color:var(--c-beige);white-space:nowrap;pointer-events:none}
.em-t{transform:translate(-50%,calc(-100% - 14px))}.em-b{transform:translate(-50%,14px)}.em-l{transform:translate(calc(-100% - 14px),-50%)}.em-r{transform:translate(14px,-50%)}
@media(max-width:1200px){.em-l{transform:translate(-50%,calc(-100% - 14px))}.em-r{transform:translate(-60%,16px)}}
@media(prefers-reduced-motion:reduce){.mt-emblem .em-mark{animation:none;opacity:.62}}
/* Rauch aus dem Fabrikschornstein (Industrie) */
.mt-smoke{fill:none;stroke:currentColor;transform-box:fill-box;transform-origin:center;animation:mt-smoke 4.5s ease-out infinite;opacity:0}
.mt-smoke.p2{animation-delay:-1.5s}.mt-smoke.p3{animation-delay:-3s}
@keyframes mt-smoke{0%{transform:translate3d(0,8px,0) scale(.6);opacity:0}30%{opacity:.7}100%{transform:translate3d(10px,-30px,0) scale(1.4);opacity:0}}
@media(prefers-reduced-motion:reduce){.mt-smoke{opacity:.5}}
/* Runde 8 Punkt 6: Branchen-Motive vollstaendig sichtbar (keine Verblendung), Text endet vor dem Motiv */
.mt-hero-br{--mtf:1.06}
.mt-hero-br>.mt{-webkit-mask-image:none;mask-image:none}
/* Runde 9 Punkt 9: Puls in der Mitte der Konstellation bleibt erhalten (vorher Ringe am Mittelpunkt), jetzt als Ring um das Logo */
.mt-hub::before{content:"";position:absolute;left:50%;top:50%;width:44%;aspect-ratio:1;margin:-22% 0 0 -22%;border:1px solid var(--c-accent-inv);border-radius:50%;opacity:0;animation:mt-hubpulse 3.2s ease-out infinite;z-index:-1}
@keyframes mt-hubpulse{0%{transform:scale(.9);opacity:.55}100%{transform:scale(1.9);opacity:0}}
@media(prefers-reduced-motion:reduce){.mt-hub::before{animation:none}}