/* e-404 — on-brand dark minimal 404 with a disconnected-node motif. Scoped to main.e-404 (styling hook added in 404.php). */
html body main.e-404{
  position:relative;isolation:isolate;overflow:hidden;display:grid;place-items:center;text-align:center;color:var(--v2-on-dark);
  min-height:clamp(560px,calc(100vh - 72px),860px);padding:clamp(72px,9vw,140px) 0 clamp(64px,8vw,120px)!important;
  background:
    radial-gradient(1000px 540px at 50% -8%,#14583390,transparent 62%),
    radial-gradient(700px 460px at 90% 90%,#0c6b4a45,transparent 60%),
    radial-gradient(600px 420px at 6% 85%,#0e5a2e3a,transparent 62%),
    var(--v2-ink)!important;
  border-radius:0 0 clamp(28px,4vw,64px) clamp(28px,4vw,64px);
}
html body main.e-404:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(#9bf0c833 1px,transparent 1.4px);background-size:34px 34px;
  -webkit-mask-image:radial-gradient(ellipse 75% 65% at 50% 40%,#000 5%,transparent 75%);mask-image:radial-gradient(ellipse 75% 65% at 50% 40%,#000 5%,transparent 75%)}
html body main.e-404 .e-404-wrap{display:flex;flex-direction:column;align-items:center;gap:clamp(24px,3vw,40px);position:relative;z-index:1}
html body main.e-404 h1{margin:0!important;max-width:14ch;font-size:clamp(44px,7vw,112px)!important;font-weight:800!important;line-height:1.02!important;letter-spacing:-.045em!important;color:#fff!important;text-wrap:balance;unicode-bidi:normal}
html body main.e-404 .btn{display:inline-flex;align-items:center;min-height:56px;padding-inline:36px;border-radius:999px!important;background:var(--v2-mint)!important;border:1px solid var(--v2-mint)!important;color:var(--v2-ink)!important;font-weight:700;font-size:17px;box-shadow:0 14px 44px #52e3a444!important}
html body main.e-404 .btn:hover{box-shadow:0 20px 56px #52e3a477!important}

.e-404-art{position:relative;width:min(900px,92vw);height:auto;aspect-ratio:1000/360;margin-bottom:clamp(-30px,-2vw,-10px);overflow:visible;pointer-events:none}
.e-404-art text{font-family:var(--v2-font);font-weight:800;fill:#52e3a40d;font-size:330px;letter-spacing:-.06em}
.e-404-art .ln{stroke:#52e3a4;stroke-width:1.4;stroke-opacity:.38;fill:none;stroke-linecap:round}
.e-404-art .ln.dim{stroke-opacity:.14;stroke-dasharray:4 8}
.e-404-art .gap{stroke:#52e3a4;stroke-width:1.4;stroke-opacity:.5;fill:none;stroke-linecap:round;stroke-dasharray:2 7}
.e-404-art .nd{fill:#52e3a4}
.e-404-art .nd.dim{fill:#52e3a4;opacity:.22}
.e-404-art .halo{fill:none;stroke:#52e3a4;stroke-width:1;opacity:.3;transform-box:fill-box;transform-origin:center}
.e-404-art .pulse{fill:#9bf0c8;filter:drop-shadow(0 0 8px #52e3a4)}
.e-404-art .spark{stroke:#9bf0c8;stroke-width:1.6;stroke-linecap:round;opacity:0}
.e-404-art .plug{fill:none;stroke:#52e3a4;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:700px){
  html body main.e-404{min-height:0;padding-top:64px!important}
  .e-404-art{width:116vw;max-width:none;margin-inline:-8vw}
  .e-404-art text{font-size:280px}
}
@media(prefers-reduced-motion:reduce){.e-404-art *{animation:none!important}}
