/* Static vector accents: no scripts, animation loops or extra font dependencies. */
.page-home #products,.technology,.inquiry,.page-intro{position:relative;isolation:isolate}
.page-home #products::before,.technology::before,.inquiry::before,.page-intro::before{content:"";position:absolute;z-index:-1;pointer-events:none;background-repeat:no-repeat;background-size:contain}

/* Sparse material structure along the edge of the product heading. */
.page-home #products::before{width:min(68%,760px);height:250px;right:0;top:18px;background-image:url('assets/material-network.svg');background-position:right top;opacity:.16;mask-image:linear-gradient(90deg,transparent,#000 65%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 65%)}
.page-home #products>.section-heading{position:relative}

/* Flowing contours give the technology section a quiet sense of depth. */
.technology{overflow:hidden}
.technology::before{width:min(1200px,88%);height:510px;right:-100px;bottom:-200px;background-image:url('assets/contour-lines.svg');background-position:right bottom;opacity:.26;mask-image:linear-gradient(135deg,transparent 8%,#000 80%);-webkit-mask-image:linear-gradient(135deg,transparent 8%,#000 80%)}
.technology-inner{position:relative}
.technology-list>a{transition:background-color .18s ease,border-color .18s ease}
.technology-list>a:hover{background:#ffffff05;border-color:#ffffff55}

/* Keep the useful text in clear space; let the network fade into the margins. */
.inquiry{overflow:hidden}
.inquiry::before{inset:0;background-image:url('assets/material-network.svg');background-size:auto 115%;background-position:right center;opacity:.2;mask-image:linear-gradient(90deg,transparent 24%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 24%,#000 100%)}
.inquiry-inner{position:relative}

/* The same visual language follows visitors onto the inner pages. */
.page-intro::before{top:0;right:0;bottom:0;width:64%;background-image:url('assets/contour-lines.svg');background-position:right center;background-size:auto 140%;opacity:.12;mask-image:linear-gradient(90deg,transparent,#000);-webkit-mask-image:linear-gradient(90deg,transparent,#000)}

/* Fine corner marks echo technical drawing registration marks. */
.product-image::after{content:"";position:absolute;left:14px;bottom:14px;width:12px;height:12px;border-left:1px solid #9cb1c866;border-bottom:1px solid #9cb1c866;pointer-events:none}
.product-image>.image-label{padding-left:10px;border-left:2px solid #245de655}

@media(max-width:760px){
  .page-home #products::before{width:86%;height:170px;top:20px;opacity:.13}
  .technology::before{width:135%;height:340px;right:-25%;bottom:-130px;opacity:.22}
  .inquiry::before{background-size:auto 80%;background-position:right bottom;opacity:.14}
  .page-intro::before{width:85%;opacity:.09}
}
@media(prefers-reduced-motion:reduce){.technology-list>a{transition:none}}
