.module-networks {
    position: relative;
    overflow: hidden;
  }
  
  .module-networks .module-inner {
    padding-bottom: calc(320 * var(--base-unit));
  }
  
  .module-networks > .background {
    position: absolute;
    top: calc(135 * var(--base-unit));
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    pointer-events: none;
  }
  
  .module-networks > .background .slant {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--base-color-dark-blue);
    z-index: 1;
    clip-path: polygon(0% var(--slant-angle), 100% 0, 100% calc(100% - var(--slant-angle)), 0% 100%);
  }
  
  .module-networks > .background .star {
    display: block;
    position: absolute;
    z-index: 2;
    top: -1vw;
    left: -6vw;
    width: calc(230 * var(--base-unit));
  }
  
  .module-networks > .background .star svg {
    display: block;
    width: 100%;
    height: auto;
  }
  
  .module-networks > .background .star-2 {
    left: auto;
    right: -4vw;
    top: -2.15vw;
  }
  
  .module-networks > .background .star-3 {
    left: auto;
    top: auto;
    right: 10.8vw;
    bottom: 7.8vw;
  }
  
  .module-networks > .background .star svg path {
    fill: var(--base-color-blue);
  }
  
  .module-networks > .background .star-2 svg path {
    fill: var(--base-color-light-green);
  }
  
  .module-networks > .background .star-3 svg path {
    fill: var(--base-color-rose);
  }
  
  .module-networks .module-inner {
    position: relative;
    z-index: 2;
  }

  .networks-list {
    --columns: 3;
    --margin: 0;
    --item-gap: var(--grid-gap);
    --item-width: calc((100% - (var(--columns) * var(--item-gap))) / var(--columns));
    margin-right: calc(var(--item-gap) * -1);
    margin-bottom: calc(var(--margin) * -1);
    display: flex;
    flex-flow: row wrap;
  }
  
  .networks-list > li:nth-child(1) { --factor: 3; }
  .networks-list > li:nth-child(2) { --factor: 1; }
  .networks-list > li:nth-child(3) { --factor: 2; }
  
  .networks-list > li {
    width: var(--item-width);
    margin-right: var(--item-gap);
    margin-bottom: var(--margin);
    flex-shrink: 0;
    transform: translateY(calc(var(--parallax-y, 0) * 5vh * var(--factor)));
  }
  
  article.network-article {
    display: flex;
    flex-flow: column nowrap;
    color: #fff;
    height: 100%;
    position: relative;
    transition: filter 750ms;
    transition-timing-function: var(--ttf);
  }
  
  article.network-article.hover {
    filter: brightness(1.1);
  }
  
  article.network-article .article-body {
    flex-grow: 1;
    display: flex;
    flex-flow: column nowrap;
    padding: 1.5625em;
  }
  
  article.network-article .btn-set {
    margin-top: auto;
    padding-top: max(20px, calc(32 * var(--base-unit)));
  }
  
  article.network-article .headline {
    margin-bottom: .625em;
  }
  
  article.network-article figure img {
    max-height: 320px;
    object-fit: cover;
  }
  
  
  
  
  
  
  @media (max-width: 1000px) {
    
    .networks-list {
      --columns: 1;
      --margin: var(--grid-gap);
    }
    
    .networks-list > li {
      transform: none;
    }
    
    article.network-article {
      flex-flow: row nowrap;
    }
    
    article.network-article figure {
      width: 250px;
      flex-shrink: 0;
    }
    
    article.network-article figure img {
      height: 100%;
      object-fit: cover;
    }
    
    article.network-article .article-body {
      width: 100%;
      box-sizing: border-box;
    }
    
  }
  
  
  
  
  
  
  
  
  
  @media (max-width: 700px) {
    
    .module-networks + .module-hero-slant {
      opacity: 0;
      pointer-events: none;
      user-select: none;
      height: var(--module-margin);
    }
    
    .module-networks .module-body {
      overflow: hidden;
      overflow-x: auto;
      margin-left: calc(var(--page-padding-left) * -1);
      margin-right: calc(var(--page-padding-right) * -1);
      scroll-snap-type: x mandatory;
    }
    
    .module-networks .module-header-b {
      margin-bottom: 100px;
    }
    
    .module-networks > .background {
      top: calc(400 * var(--base-unit));
    }
    
    .networks-list {
      --item-width: calc(100vw - var(--page-padding-left) - var(--page-padding-right));
      --margin: 0;
      flex-flow: row nowrap;
      padding-left: var(--page-padding-left);
      padding-right: var(--page-padding-right);
      width: fit-content;
    }
    
    .networks-list > li {
      scroll-snap-align: center;
    }
    
    article.network-article {
      flex-flow: column nowrap;
    }
    
    article.network-article figure {
      width: 100%;
    }
    
    article.network-article figure img {
      height: auto;
    }
    
    
    
  }
  
  
  
  
  
  
  @media (max-width: 500px) {
    
    article.network-article figure img {
      height: 60vw;
      object-fit: cover;
    }
    
  }