/* Studio Mierenwerk - DE ROUTE: de mier loopt de pagina af terwijl je scrolt (route.js).
   Een document-hoge SVG in de rechter marge, buiten .wrap, alleen op brede schermen.
   De stippellijn, de knooppunten (inkt, oxide zodra de mier ze gepasseerd is) en de open rode
   ring aan het eind komen uit het route-element van het merk. De mier is die van het
   portret-moment, van boven, en volgt de lijn. route.js maakt de SVG pas aan vanaf 1024px; de media query
   hieronder is de tweede borg, voor het geval de breedte wisselt voordat het script opruimt.
   Onder 1024px krijgt elke sectiekop in plaats daarvan een kort stukje route (.mw-route-m):
   een horizontale stippellijn over de breedte van de kop, het knooppunt van de sectie aan het
   eind, en dezelfde mier die het stukje afloopt terwijl de kop door het venster schuift. */
.mw-route{position:absolute; top:0; z-index:5; width:56px; pointer-events:none; overflow:visible;
  /* gecentreerd in de buitenmarge rechts van .wrap; op 1024px valt dat samen met de rand */
  right:clamp(0px, calc((100% - var(--mw-content)) / 4 - 28px), 240px);}
.mw-route-pad{fill:none; stroke:var(--mw-ink); stroke-width:1.5; stroke-dasharray:2 8; stroke-linecap:round; opacity:.4;}
.mw-route-knoop{fill:var(--mw-ink); transition:fill var(--mw-duration) var(--mw-ease);}
.mw-route-knoop.gepasseerd{fill:var(--mw-oxide);}
.mw-route-ring{fill:none; stroke:var(--mw-oxide); stroke-width:2;}
.mw-route-lijf{fill:var(--mw-ink);}
/* poten en voelsprieten: 1,5 px zoals elke lijn van het merk, ongeacht de schaal van de mier */
.mw-route-poot{fill:none; stroke:var(--mw-ink); stroke-width:1.5; stroke-linecap:round; vector-effect:non-scaling-stroke;}
@media(max-width:1023.98px){.mw-route{display:none;}}

/* mobiel: het stukje route staat in de ondermarge van de sectiekop, binnen .wrap, en mag
   niets zijwaarts laten uitsteken. De mier (28px lang) loopt over de lijn naar het knooppunt. */
.mw-route-m{display:block; width:100%; height:36px; margin:-14px 0 6px; overflow:visible; pointer-events:none;}
@media(min-width:1024px){.mw-route-m{display:none;}}