/* Visual-only extension: original layout, spacing tokens, type, navigation, and
   content remain owned by style.css, responsive.css, and pages.css. */
#digital-field{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.95}
main,.footer{position:relative;z-index:1}
.hero-art{perspective:1150px}
.hero-art .tech-scene{position:absolute;width:560px;height:500px;left:50%;top:50%;right:auto;bottom:auto;margin:-250px 0 0 -280px;scale:.92;transform-style:preserve-3d;transition:none;will-change:transform}
.page-art .tech-scene{scale:.84}
.hero-art .scene-halo{background:radial-gradient(ellipse at 55% 48%,#bd0d3436,transparent 62%);filter:blur(30px)}
.environment-grid{position:absolute;left:-10%;right:-15%;top:47%;height:70%;background-image:linear-gradient(#a7243917 1px,transparent 1px),linear-gradient(90deg,#a7243917 1px,transparent 1px);background-size:45px 45px;transform:rotateX(65deg) rotateZ(-12deg);mask-image:radial-gradient(ellipse,#000,transparent 70%);pointer-events:none}
.depth-layer{position:absolute;transform-style:preserve-3d;transform:translate3d(var(--dx,0px),var(--dy,0px),var(--z,0px)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotateZ(var(--rz,0deg));will-change:transform}
.float-surface{border:1px solid #6a435155;background:linear-gradient(125deg,#252027f5,#100e14f7 65%);border-radius:7px;overflow:hidden;box-shadow:inset 0 1px 0 #ffe1ec10,0 18px 35px #0008,0 1px 2px #000;animation:system-float var(--float-time,14s) ease-in-out infinite;animation-delay:var(--float-delay,0s)}
.network-layer{inset:0;--z:-100px;color:#b6315150;opacity:.7}
.network-layer svg{width:100%;height:100%;filter:drop-shadow(0 0 6px #ed123b30)}
.network-label{position:absolute;bottom:5%;left:40%;font:6px var(--mono);letter-spacing:1.3px;color:#a471884d}
.browser-layer{left:9px;top:40px;width:205px;--z:-75px;--rx:5deg;--ry:18deg;--rz:-8deg;--float-time:19s;--float-delay:-5s;opacity:.8}
.system-chrome{height:29px;display:flex;align-items:center;gap:12px;padding:0 11px;border-bottom:1px solid #ffffff0b;font:8px var(--mono);color:#9d919f}
.system-chrome>small{font-size:7px;font-weight:400;flex:1}
.system-chrome>span:last-child:not(.ui-dots){font-size:8px;color:#bd7389}
.ui-dots{display:flex;gap:4px}
.ui-dots i{width:4px;height:4px;border-radius:50%;background:#5f444f}
.ui-dots i:first-child{background:var(--red)}
.browser-address{margin:9px 10px;padding:4px 8px;background:#09090c60;border-radius:3px;font:6px var(--mono);color:#877582;border:1px solid #46323b45}
.browser-address span{color:var(--red);margin-right:9px}
.browser-ui{padding:10px 15px 15px;background:radial-gradient(at 85% 55%,#a6103020,transparent 60%)}
.browser-ui .micro-label{font-size:5px;letter-spacing:1px}
.browser-ui strong{display:block;font-size:23px;line-height:1;letter-spacing:-1px;margin-top:10px;color:#cfc5cd}
.browser-ui strong>span{color:var(--red)}
.browser-cta{height:8px;width:49px;background:var(--red);margin:12px 0;box-shadow:0 0 13px #ec123b20}
.browser-tiles{display:flex;gap:6px}
.browser-tiles i{height:24px;flex:1;background:linear-gradient(140deg,#ffffff0c,#ffffff02);border:1px solid #ffffff09}
.core-layer{left:207px;top:175px;width:194px;height:194px;--z:22px;--ry:-8deg;--rx:7deg}
.core-float{position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:core-drift 17s ease-in-out infinite}
.data-core{position:relative;width:100%;height:100%;border-radius:48% 52% 50% 47%;background:radial-gradient(circle at 32% 19%,#ff96a43d 0,transparent 19%),radial-gradient(circle at 28% 27%,#ef3656 0,#c40930 18%,#6e091f 44%,#190910 70%,#380916 88%,#be1237 100%);box-shadow:inset 2px 3px 4px #ff81998a,inset -4px -3px 8px #f2265966,inset -18px -14px 30px #0009,0 0 0 1px #9e244a88,0 0 32px #ed123b2b,22px 35px 50px #0007;overflow:hidden;transform-style:preserve-3d}
.data-core::before{content:'';position:absolute;inset:0;border-radius:50%;background:repeating-linear-gradient(0deg,transparent 0 13px,#ffbbc20b 13px 14px);mix-blend-mode:screen;opacity:.7;transform:rotate(-18deg)}
.data-core::after{content:'';position:absolute;inset:3%;border-radius:50%;border-top:1px solid #ffd3d480;border-left:1px solid #ffbdcb2a;transform:rotate(-25deg);filter:blur(.4px)}
.core-contour{position:absolute;inset:-5% 23%;border:1px solid #f09eac30;border-radius:50%;transform:rotate(-35deg)}
.contour-two{inset:19% -15%;transform:rotate(-27deg);border-color:#ffb3c030}
.contour-three{inset:38% -10%;transform:rotate(-25deg);border-color:#f87b9950}
.core-mesh{position:absolute;width:85%;height:85%;left:40%;top:25%;background-image:radial-gradient(#ff83984a .65px,transparent .9px);background-size:6px 6px;transform:rotate(-25deg);mask-image:radial-gradient(ellipse,#000,transparent 65%)}
.core-light{position:absolute;inset:-60%;background:conic-gradient(from 10deg,transparent 0deg,#ffd5dc0a 35deg,transparent 80deg);animation:core-light 20s linear infinite}
.data-core>img{position:absolute;width:95px;left:44px;top:72px;mix-blend-mode:screen;opacity:.88;transform:rotate(-12deg);filter:drop-shadow(0 2px 2px #0005)}
.core-chip{position:absolute;left:40px;top:130px;font:4px var(--mono);letter-spacing:1.2px;color:#f7b5c675;transform:rotate(-12deg)}
.core-port{position:absolute;width:3px;height:3px;border-radius:50%;background:#ffbbcb;box-shadow:0 0 9px #ff1d53}
.port-one{left:30px;top:74px}.port-two{left:135px;top:33px}.port-three{right:18px;bottom:58px}
.core-shadow{position:absolute;left:0;right:-10%;bottom:-40px;height:25px;background:#f4154220;border-radius:50%;filter:blur(20px);transform:rotate(-10deg)}
.overview-layer{width:230px;right:0;top:53px;--z:55px;--ry:-16deg;--rx:5deg;--rz:8deg;--float-time:16s;--float-delay:-7s}
.system-content{padding:14px}
.system-label{display:flex;justify-content:space-between;align-items:center;font:7px var(--mono);letter-spacing:1px;color:#c2a6b3}
.system-label span{font-size:5px;color:#dd4b71;letter-spacing:.5px}
.system-metrics{display:grid;grid-template-columns:1.2fr 1fr;gap:8px;margin-top:12px}
.system-metrics>div{border:1px solid #bca5b712;padding:9px;background:#05030930;border-radius:3px}
.system-metrics small{display:block;font-size:6px;color:#a898a5}
.system-metrics strong{display:block;font:17px var(--font);letter-spacing:-.7px;line-height:1.3;margin:3px 0}
.system-metrics em{font:5px var(--mono);color:#da6882;font-style:normal}
.system-graph{display:block;width:100%;height:56px;margin-top:12px;overflow:visible}
.system-footer{display:flex;align-items:center;gap:4px;margin-top:9px;font:4px var(--mono);color:#988694;letter-spacing:.4px}
.system-footer>span:first-child{margin-right:auto}.system-footer>span:last-child{margin-left:auto}
.system-footer i{width:11px;height:3px;background:#a22146}.system-footer i:last-of-type{opacity:.5}
.editor-layer{width:252px;left:13px;top:278px;--z:105px;--ry:15deg;--rx:6deg;--rz:-7deg;--float-time:18s;--float-delay:-2s}
.editor-tabs{display:flex;gap:15px;align-items:center;height:24px;border-bottom:1px solid #ffffff08;padding:0 13px;font:6px var(--mono);color:#bc9fad}
.editor-tabs span{height:100%;padding-top:8px;border-bottom:1px solid var(--red)}
.editor-tabs small{font-size:5px;color:#796574}
.editor-code{padding:12px 13px;font:8px/1.9 var(--mono);color:#c1b4c2}
.editor-code>div{display:flex;gap:13px}.editor-code i{font-style:normal;color:#665864;font-size:7px}
.editor-code em{font-style:normal;color:#ed6a91}.editor-code b{font-weight:400;color:#eac8d3}.editor-code strong{font-weight:400;color:#bf96b7}
.editor-status{display:flex;gap:6px;padding:7px 11px;border-top:1px solid #ffffff08;font:5px var(--mono);color:#9c8496;background:#aa174210}
.editor-status>span{color:var(--red)}.editor-status small{margin-left:auto;font-size:5px}
.growth-layer{width:146px;right:23px;top:354px;--z:145px;--ry:-14deg;--rx:4deg;--rz:7deg;--float-time:13s;--float-delay:-9s}
.growth-card{padding:14px;background:linear-gradient(130deg,#341725f5,#160f19fa);border-color:#9f3a5955}
.growth-card>strong{font-size:28px;letter-spacing:-1.5px;display:block;margin:6px 0;color:#ead5df;line-height:1.2;font-weight:500}
.growth-card>strong span{font-size:20px;color:#af768d}
.growth-bars{display:grid;gap:3px;margin-top:9px}.growth-bars i{height:3px;background:linear-gradient(90deg,#871330,var(--red));width:65%;border-radius:1px}.growth-bars i:nth-child(2){width:80%}.growth-bars i:nth-child(3){width:100%}
.growth-card>small{font:4px var(--mono);letter-spacing:.7px;color:#a6768b;display:block;margin-top:10px}
.sync-layer{left:332px;top:298px;--z:-70px;--rz:7deg}
.sync-card{font:6px var(--mono);letter-spacing:1px;border:1px solid #78405a5c;background:#190d16b0;padding:9px 11px;border-radius:3px;white-space:nowrap;color:#ad7d91}
.sync-card i{display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--red);margin-right:6px;box-shadow:0 0 6px #ec123b66}
.art-process .tech-scene::before,.art-contact .tech-scene::after{display:none}
.art-about .core-layer{--ry:8deg}.art-contact .network-layer{opacity:1}.art-projects .browser-layer{--z:-25px}.art-services .overview-layer{--rz:5deg}

/* Existing icon slots retain their dimensions. All glyph assets are local SVGs. */
.visual-icon{width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 0 8px #ec123b16)}
.service-icon{display:inline-block;width:36px;height:36px}
.service-icon .visual-icon{width:32px;height:32px}
.service-card:hover .visual-icon{filter:drop-shadow(0 0 8px #ec123b55)}
.detail-visual>span>.visual-icon{width:73px;height:73px;filter:drop-shadow(0 9px 14px #ec123b20)}
.process-tabs .process-icon{position:absolute;right:25%;top:0;width:16px;height:16px;opacity:.65}
.process-tabs [aria-selected=true] .process-icon{opacity:1;filter:drop-shadow(0 0 5px #ec123b44)}
.process-symbol>.visual-icon{width:95px;height:95px;margin:auto}
.industry-icon{width:22px;height:22px;flex:none;opacity:.8}
.industry-grid a{justify-content:flex-start}
.industry-grid a>span{margin-left:auto}
.industry-detail-icon{position:absolute;right:25px;top:25px;width:24px;height:24px;opacity:.45}
.industry-detail:hover .industry-detail-icon{opacity:1;filter:drop-shadow(0 0 8px #ec123b30)}
.tech-icon-grid{perspective:1000px}
.technology-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 32px;margin-top:48px}
.technology-group{min-width:0;border-top:1px solid var(--line);padding-top:22px}
.technology-group>.eyebrow{margin-bottom:18px;color:var(--muted)}
.technology-group .tech-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));margin-top:0;background:none}
.technology-group .tech-card{min-height:123px}
.tech-logo[src$="nextjs.svg"]{filter:grayscale(1) invert(.85)}
.tech-logo[src$="threejs.svg"],.tech-logo[src$="express.svg"],.tech-logo[src$="django.svg"],.tech-logo[src$="gsap.svg"],.tech-logo[src$="wails.svg"]{filter:grayscale(1) brightness(0) invert(.85)}
@media(max-width:800px){.technology-groups{grid-template-columns:1fr;gap:30px}.technology-group .tech-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}
@media(max-width:360px){.technology-group .tech-grid{grid-template-columns:repeat(auto-fill,minmax(85px,1fr))}}
.tech-icon-grid .tech-card{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:25px 10px;position:relative;background:linear-gradient(140deg,#1a171cf5,#101013);outline-offset:-3px;transform-style:preserve-3d;transition:transform .3s,border-color .3s,box-shadow .3s;z-index:0;min-width:0}
.tech-icon-grid .tech-card::before{display:none}
.tech-icon-grid .tech-card::after{position:absolute;inset:0;content:'';border:1px solid transparent;pointer-events:none;transition:border-color .3s}
.tech-icon-grid .tech-card:hover,.tech-icon-grid .tech-card:focus-visible{transform:translateZ(18px) rotateX(3deg) translateY(-3px);box-shadow:0 12px 35px #0005,0 0 30px #ec123b13;z-index:2}
.tech-icon-grid .tech-card:hover::after,.tech-icon-grid .tech-card:focus-visible::after{border-color:#ad2a4d88}
.tech-icon-grid .tech-name{display:block;padding:0;font-size:13px;font-weight:500;background:none;color:#b8acba;line-height:1.4}
.tech-icon-grid .tech-name::before{display:none}
.tech-icon-grid .tech-card:hover .tech-name,.tech-icon-grid .tech-card:focus-visible .tech-name{color:#f4f3f1}
.tech-logo{width:34px;height:34px;object-fit:contain;filter:grayscale(1) brightness(1.8);opacity:.78;animation:icon-drift 11s ease-in-out infinite;transition:scale .3s,filter .3s,opacity .3s;animation-play-state:paused}
.visual-in-view .tech-logo{animation-play-state:running}
.tech-card:nth-child(3n+2) .tech-logo{animation-duration:14s;animation-delay:-4s;--icon-x:3px;--icon-y:-1px}
.tech-card:nth-child(4n) .tech-logo{animation-duration:17s;animation-delay:-8s;--icon-x:-2px;--icon-y:-3px;--icon-rotate:4deg}
.tech-card:nth-child(7) .tech-logo{--icon-x:3px;--icon-y:-3px;--icon-rotate:6deg}
.tech-card:hover .tech-logo,.tech-card:focus-visible .tech-logo{scale:1.1;opacity:1;filter:grayscale(1) brightness(2.2) drop-shadow(0 0 6px #ec123b30)}
.tech-card:is(:hover,:focus-visible) .tech-logo[src$="nextjs.svg"]{filter:grayscale(1) invert(.95) drop-shadow(0 0 6px #ec123b30)}
.tech-card:is(:hover,:focus-visible) .tech-logo:is([src$="threejs.svg"],[src$="express.svg"],[src$="django.svg"],[src$="gsap.svg"],[src$="wails.svg"]){filter:brightness(0) invert(.95) drop-shadow(0 0 6px #ec123b30)}
.tech-card .tech-logo[src$="shopify.svg"],.badge-icon[src$="shopify.svg"]{filter:invert(.8)}
.technology-badges{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.technology-badges>span{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;font:8px var(--mono);color:#c4b0c0;border:1px solid #6d35483d;background:linear-gradient(120deg,#2a142021,#171016);border-radius:3px}
.badge-icon{width:13px;height:13px;object-fit:contain;filter:grayscale(1) brightness(1.7);opacity:.8}
@keyframes system-float{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes core-drift{0%,100%{transform:translateY(0) rotateX(-3deg) rotateY(-7deg) rotateZ(-6deg) scale(1)}50%{transform:translateY(-9px) rotateX(5deg) rotateY(8deg) rotateZ(3deg) scale(1.025)}}
@keyframes core-light{to{transform:rotate(360deg)}}
@keyframes icon-drift{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(var(--icon-x,0px),var(--icon-y,-4px)) rotate(var(--icon-rotate,0deg))}}
.offscreen .float-surface,.offscreen .core-float,.offscreen .core-light,.visual-paused .float-surface,.visual-paused .core-float,.visual-paused .core-light,.visual-paused .tech-logo{animation-play-state:paused}
@media(max-width:1100px){.hero-art .tech-scene{scale:.83}.page-art .tech-scene{scale:.8}.detail-visual>span>.visual-icon{width:60px;height:60px}}
@media(max-width:800px){.hero-art .tech-scene{scale:.79}.page-art .tech-scene{scale:.76}.detail-visual>span>.visual-icon{width:44px;height:44px}.tech-icon-grid .tech-name{font-size:12px}.industry-icon{width:18px;height:18px}.industry-detail-icon{width:21px;height:21px;top:14px;right:16px}}
@media(max-width:600px){.hero-art .tech-scene{width:560px;height:500px;left:50%;top:50%;margin:-250px 0 0 -280px;scale:.61}.page-art .tech-scene{scale:.57}.browser-layer{opacity:.64}.hero-art .scene-caption{font-size:5px}.process-tabs .process-icon{right:6px;width:14px;height:14px}.industry-grid a{gap:9px}.industry-icon{width:17px;height:17px}.industry-grid a>span{font-size:15px}.detail-visual>span>.visual-icon{width:47px;height:47px}.tech-logo{width:29px;height:29px}.tech-icon-grid .tech-card{padding:23px 8px;gap:12px}.tech-icon-grid .tech-name{font-size:11px}.technology-badges>span{font-size:7px}.environment-grid{opacity:.5}}
@media(max-width:360px){.hero-art .tech-scene{scale:.51}.page-art .tech-scene{scale:.49}.industry-grid a{gap:6px}.industry-icon{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){.float-surface,.core-float,.core-light,.tech-logo{animation:none!important}.depth-layer,.hero-art .tech-scene{will-change:auto}.tech-icon-grid .tech-card:hover,.tech-icon-grid .tech-card:focus-visible{transform:none}.tech-card:hover .tech-logo{scale:1}}