.brutal-icon{position:relative;flex:0 0 auto;display:grid;place-items:center;border:2px solid currentColor;border-radius:0;background:var(--paper);color:var(--ink);box-shadow:.38rem .38rem 0 currentColor;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .25s,color .25s}
.brutal-icon::after{content:"+";position:absolute;top:.12rem;right:.2rem;font-family:var(--font-mono);font-size:.48rem;font-weight:800;line-height:1}
.icon-glyph{width:52%;height:52%;display:block;background:currentColor;mask:var(--icon-url) center/contain no-repeat;-webkit-mask:var(--icon-url) center/contain no-repeat}
.icon-code-xml{--icon-url:url("../assets/icons/code-xml.svg")}.icon-palette{--icon-url:url("../assets/icons/palette.svg")}.icon-braces{--icon-url:url("../assets/icons/braces.svg")}.icon-atom{--icon-url:url("../assets/icons/atom.svg")}.icon-wind{--icon-url:url("../assets/icons/wind.svg")}.icon-sparkles{--icon-url:url("../assets/icons/sparkles.svg")}.icon-compass{--icon-url:url("../assets/icons/compass.svg")}.icon-panels{--icon-url:url("../assets/icons/panels-top-left.svg")}.icon-code-2{--icon-url:url("../assets/icons/code-2.svg")}.icon-scan-search{--icon-url:url("../assets/icons/scan-search.svg")}.icon-layout-template{--icon-url:url("../assets/icons/layout-template.svg")}.icon-blocks{--icon-url:url("../assets/icons/blocks.svg")}.icon-orbit{--icon-url:url("../assets/icons/orbit.svg")}
.skill-list article{grid-template-columns:3rem 4.25rem 1fr 1fr;gap:.75rem}
.skill-icon{width:3.15rem;height:3.15rem;box-shadow:.28rem .28rem 0 var(--accent-violet)}
.skill-list article:nth-child(3n+1) .skill-icon{background:var(--accent);box-shadow:.28rem .28rem 0 var(--accent-cyan)}
.skill-list article:nth-child(3n+2) .skill-icon{background:var(--accent-violet);box-shadow:.28rem .28rem 0 var(--accent-magenta)}
.skill-list article:nth-child(3n) .skill-icon{background:var(--accent-cyan);box-shadow:.28rem .28rem 0 var(--accent)}
.skill-list article:hover .skill-icon{transform:translate(-.14rem,-.14rem) rotate(-4deg);box-shadow:.48rem .48rem 0 var(--accent-magenta)}
.process-icon{width:3.7rem;height:3.7rem;margin-top:3rem;background:var(--accent-violet);box-shadow:.34rem .34rem 0 var(--accent-cyan)}
.process-step:nth-child(2) .process-icon{background:var(--accent-cyan);box-shadow:.34rem .34rem 0 var(--accent)}
.process-step:nth-child(3) .process-icon{background:var(--accent);box-shadow:.34rem .34rem 0 var(--accent-violet)}
.process-step:nth-child(4) .process-icon{background:var(--accent-magenta);box-shadow:.34rem .34rem 0 var(--accent-cyan)}
.process-step:hover .process-icon{transform:translate(-.12rem,-.12rem) rotate(5deg);box-shadow:.55rem .55rem 0 var(--paper)}
.service-icon.brutal-icon{width:5.5rem;height:5.5rem;margin:4rem 0 auto;border:2px solid currentColor;border-radius:0;background:var(--ink);color:var(--accent);box-shadow:.5rem .5rem 0 rgba(11,11,11,.3)}
.service-card:nth-child(2) .service-icon{background:var(--accent-violet);color:var(--ink);box-shadow:.5rem .5rem 0 var(--accent-cyan)}
.service-card:nth-child(3) .service-icon{background:var(--accent-cyan);color:var(--ink);box-shadow:.5rem .5rem 0 var(--accent-magenta)}
.service-card:hover .service-icon{transform:translate(-.18rem,-.18rem) rotate(-6deg);box-shadow:.72rem .72rem 0 var(--accent-magenta)}
@media(max-width:700px){.skill-list article{grid-template-columns:2rem 3.5rem 1fr;gap:.65rem}.skill-list p{grid-column:3}.skill-icon{width:2.75rem;height:2.75rem}.process-icon{margin-top:2.25rem}}
@media(prefers-reduced-motion:reduce){.brutal-icon{transition:none}.skill-list article:hover .skill-icon,.process-step:hover .process-icon,.service-card:hover .service-icon{transform:none}}