/* A small WebGPU material dial layered into the architectural hero. */
.hero-gpu-shell{position:absolute;z-index:2;top:15%;right:5%;width:min(36vw,500px);aspect-ratio:1;pointer-events:none;opacity:.84;filter:drop-shadow(0 0 38px #d5e8ad25)}
.hero-gpu-shell::before,.hero-gpu-shell::after{position:absolute;z-index:1;width:16px;height:16px;content:"";border-color:#e8f3d07d;pointer-events:none}
.hero-gpu-shell::before{top:0;left:0;border-top:1px solid;border-left:1px solid}
.hero-gpu-shell::after{right:0;bottom:0;border-right:1px solid;border-bottom:1px solid}
.hero-gpu-shell canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .8s ease}
.hero-gpu-shell[data-renderer="webgpu"] canvas,.hero-gpu-shell[data-renderer="webgl2"] canvas{opacity:1}
.hero-gpu-fallback{position:absolute;inset:0;opacity:.7;transition:opacity .55s ease}
.hero-gpu-shell[data-renderer="webgpu"] .hero-gpu-fallback,.hero-gpu-shell[data-renderer="webgl2"] .hero-gpu-fallback{opacity:0}
.hero-gpu-ring{position:absolute;left:50%;top:50%;display:block;border:1px solid #d5e8ad7d;border-radius:50%;transform:translate(-50%,-50%)}
.hero-gpu-ring--outer{width:86%;height:86%;border-style:dashed;opacity:.64}
.hero-gpu-ring--mid{width:65%;height:65%;border-color:#d5e8ad99;box-shadow:0 0 35px #a9ce6e22,inset 0 0 35px #a9ce6e11}
.hero-gpu-ring--inner{width:35%;height:35%;border-color:#d5e8ad55}
.hero-gpu-core{position:absolute;left:50%;top:50%;color:#dbedb9;font-size:48px;font-weight:200;line-height:1;transform:translate(-50%,-50%);text-shadow:0 0 28px #c8e2987d}
.hero-gpu-note{position:absolute;left:24px;bottom:16px;color:#e5f0d3;font-size:8px;font-weight:700;letter-spacing:.19em;text-shadow:0 2px 8px #0d1613}
@media(max-width:1100px){.hero-gpu-shell{top:17%;right:2%;width:min(39vw,440px);opacity:.72}.hero-gpu-note{display:none}}
@media(max-width:760px){.hero-gpu-shell{top:10%;right:-11%;width:min(77vw,335px);opacity:.52}.hero-gpu-note{font-size:7px;left:18px;bottom:12px}.hero-gpu-shell::before,.hero-gpu-shell::after{width:12px;height:12px}}
@media(max-width:420px){.hero-gpu-shell{top:10%;right:-18%;width:74vw;opacity:.43}}
@media(prefers-reduced-motion:reduce){.hero-gpu-shell canvas,.hero-gpu-fallback{transition:none}}
